javascript - Rails 6 SPA ActiveStorage 无效的请求参数:UTF-8 中的无效字节序列
问题描述
我一直在尝试将 mp3 从 React SPA 应用程序上传到 Rails 后端,但没有成功。我正在使用带有本地存储后端的活动存储。
不幸的是,我总是Invalid request parameters: invalid byte sequence in UTF-8
在上传时遇到问题。
红宝石 2.6.2 轨道 6.0.2.1
const formData = new FormData();
formData.append('name', values.name);
formData.append('text', values.text);
formData.append('transition', values.transition);
formData.append('audio', values.audio[0]);
// Store state
const response = await fetch(`${API_URL}/states/${state.id}`, {
method: 'PUT',
headers: {
'Content-Type': 'multipart/form-data',
'Authorization': `Bearer ${localStorage.getItem('token')}`
},
body: formData
});
控制器:
# PATCH/PUT /states/1
def update
if @state.update state_params
render json: { state: @state }
else
render json: @state.errors, status: :unprocessable_entity
end
end
private
def state_params
params.require(:state).permit(
:name,
:content,
:text,
:transition,
:left,
:top,
:feature_id,
audio: {}
)
end
模型:
class State < ApplicationRecord
has_one_attached :audio
end
请求标头:
Host: localhost:3000
User-Agent: Mozilla/5.0 (X11; Linux x86_64; rv:74.0) Gecko/20100101 Firefox/74.0
Accept: */*
Accept-Language: en-US,fr-FR;q=0.7,en;q=0.3
Accept-Encoding: gzip, deflate
Referer: http://localhost:8000/surveys/1
Content-Type: multipart/form-data
Authorization: Bearer XXXXXXXXXXXX
Origin: http://localhost:8000
Content-Length: 4705407
Connection: keep-alive
Pragma: no-cache
Cache-Control: no-cache
错误堆栈:
Started PUT "/api/v1/states/37" for 127.0.0.1 at 2020-02-26 13:08:25 +0100
ActionController::BadRequest (Invalid request parameters: invalid byte sequence in UTF-8):
rack (2.2.2) lib/rack/query_parser.rb:86:in `normalize_params'
rack (2.2.2) lib/rack/query_parser.rb:71:in `block in parse_nested_query'
rack (2.2.2) lib/rack/query_parser.rb:68:in `each'
rack (2.2.2) lib/rack/query_parser.rb:68:in `parse_nested_query'
rack (2.2.2) lib/rack/request.rb:590:in `parse_query'
rack (2.2.2) lib/rack/request.rb:454:in `POST'
actionpack (6.0.2.1) lib/action_dispatch/http/request.rb:382:in `block (2 levels) in POST'
actionpack (6.0.2.1) lib/action_dispatch/http/parameters.rb:109:in `block in parse_formatted_parameters'
actionpack (6.0.2.1) lib/action_dispatch/http/parameters.rb:109:in `fetch'
actionpack (6.0.2.1) lib/action_dispatch/http/parameters.rb:109:in `parse_formatted_parameters'
actionpack (6.0.2.1) lib/action_dispatch/http/request.rb:381:in `block in POST'
rack (2.2.2) lib/rack/request.rb:69:in `fetch'
rack (2.2.2) lib/rack/request.rb:69:in `fetch_header'
actionpack (6.0.2.1) lib/action_dispatch/http/request.rb:380:in `POST'
actionpack (6.0.2.1) lib/action_dispatch/http/parameters.rb:55:in `parameters'
actionpack (6.0.2.1) lib/action_dispatch/http/filter_parameters.rb:43:in `filtered_parameters'
actionpack (6.0.2.1) lib/action_controller/metal/instrumentation.rb:23:in `process_action'
actionpack (6.0.2.1) lib/action_controller/metal/params_wrapper.rb:245:in `process_action'
activerecord (6.0.2.1) lib/active_record/railties/controller_runtime.rb:27:in `process_action'
actionpack (6.0.2.1) lib/abstract_controller/base.rb:136:in `process'
actionpack (6.0.2.1) lib/action_controller/metal.rb:191:in `dispatch'
actionpack (6.0.2.1) lib/action_controller/metal.rb:252:in `dispatch'
actionpack (6.0.2.1) lib/action_dispatch/routing/route_set.rb:51:in `dispatch'
actionpack (6.0.2.1) lib/action_dispatch/routing/route_set.rb:33:in `serve'
actionpack (6.0.2.1) lib/action_dispatch/journey/router.rb:49:in `block in serve'
actionpack (6.0.2.1) lib/action_dispatch/journey/router.rb:32:in `each'
actionpack (6.0.2.1) lib/action_dispatch/journey/router.rb:32:in `serve'
actionpack (6.0.2.1) lib/action_dispatch/routing/route_set.rb:837:in `call'
rack (2.2.2) lib/rack/etag.rb:27:in `call'
rack (2.2.2) lib/rack/conditional_get.rb:40:in `call'
rack (2.2.2) lib/rack/head.rb:12:in `call'
activerecord (6.0.2.1) lib/active_record/migration.rb:567:in `call'
actionpack (6.0.2.1) lib/action_dispatch/middleware/callbacks.rb:27:in `block in call'
activesupport (6.0.2.1) lib/active_support/callbacks.rb:101:in `run_callbacks'
actionpack (6.0.2.1) lib/action_dispatch/middleware/callbacks.rb:26:in `call'
actionpack (6.0.2.1) lib/action_dispatch/middleware/executor.rb:14:in `call'
actionpack (6.0.2.1) lib/action_dispatch/middleware/actionable_exceptions.rb:17:in `call'
actionpack (6.0.2.1) lib/action_dispatch/middleware/debug_exceptions.rb:32:in `call'
actionpack (6.0.2.1) lib/action_dispatch/middleware/show_exceptions.rb:33:in `call'
railties (6.0.2.1) lib/rails/rack/logger.rb:38:in `call_app'
railties (6.0.2.1) lib/rails/rack/logger.rb:26:in `block in call'
activesupport (6.0.2.1) lib/active_support/tagged_logging.rb:80:in `block in tagged'
activesupport (6.0.2.1) lib/active_support/tagged_logging.rb:28:in `tagged'
activesupport (6.0.2.1) lib/active_support/tagged_logging.rb:80:in `tagged'
railties (6.0.2.1) lib/rails/rack/logger.rb:26:in `call'
actionpack (6.0.2.1) lib/action_dispatch/middleware/remote_ip.rb:81:in `call'
actionpack (6.0.2.1) lib/action_dispatch/middleware/request_id.rb:27:in `call'
rack (2.2.2) lib/rack/runtime.rb:22:in `call'
activesupport (6.0.2.1) lib/active_support/cache/strategy/local_cache_middleware.rb:29:in `call'
actionpack (6.0.2.1) lib/action_dispatch/middleware/executor.rb:14:in `call'
actionpack (6.0.2.1) lib/action_dispatch/middleware/static.rb:126:in `call'
rack (2.2.2) lib/rack/sendfile.rb:110:in `call'
actionpack (6.0.2.1) lib/action_dispatch/middleware/host_authorization.rb:83:in `call'
rack-utf8_sanitizer (1.6.0) lib/rack/utf8_sanitizer.rb:22:in `call'
rack-cors (1.0.3) lib/rack/cors.rb:95:in `call'
railties (6.0.2.1) lib/rails/engine.rb:526:in `call'
puma (3.12.1) lib/puma/configuration.rb:227:in `call'
puma (3.12.1) lib/puma/server.rb:660:in `handle_request'
puma (3.12.1) lib/puma/server.rb:474:in `process_client'
puma (3.12.1) lib/puma/server.rb:334:in `block in run'
puma (3.12.1) lib/puma/thread_pool.rb:135:in `block in spawn_thread'
谢谢你的帮助
解决方案
要使用上传文件
fetch
,FormData
您不能设置Content-Type
标题。
来自:https ://muffinman.io/uploading-files-using-fetch-multipart-form-data/
推荐阅读
- elasticsearch - 我可以将 Elasticsearch 中的字段类型同时设置为 ip 和 ip_range 吗?
- sql - 如何在sql中计算销售和回报的百分比
- docker - RUN 命令抛出“未找到”
- c# - 我想在我的应用程序上有一个边框突出显示动画
- jhipster - 实体组件:clear() 方法是做什么用的?
- javascript - 如何使用javascript将数据从一个excel单元格提取到html页面中?
- extendscript - 未定义不是后效扩展脚本中的对象
- java - 如何在 CSV 文件的特定单元格中写入?
- python - 使用 string.format() 方法将数据从 Pandas Dataframe 传递到 String
- ios - 使用数组中的新信息更新该对象并显示 tableview Swift