无法使用formdata将文件发送到ruby on rails后端

Question

我的react应用程序中有以下代码：

this.handlefileupload = (e) => {

console.log(e.target.files[0])
var formdata = new FormData()


formdata.append('file', e.target.files[0])

axios.post('http://localhost:3000/api/v1/upload_document', {
myfile: formdata
}, {
headers: {
Authorization: "Bearer " + sessionStorage.getItem('loginToken'),
'Content-Type': 'multipart/form-data'
}
}
)
.then((response) => {
console.log('success')
}
)
.catch(function (error) {
console.log(error.response);
});
}

然后在我的RubyonRails应用程序中有以下内容：

def upload
uploaded_io = params[:myfile][:file]
File.open(Rails.root.join('public', 'uploads', uploaded_io.original_filename), 'wb') do |file|
file.write(uploaded_io.read)
end
end

我得到以下错误：

在6ms内完成500内部服务器错误(ActiveRecord:1.0ms(

NoMethodError(nil:NilClass的未定义方法"[]"(：

很可能是因为它没有接收到文件？

Answer 1

后端params[:files][:file]中的参数

但您将其作为params[:file]从react发送

将反应代码更改为formdata.append('files[file]', e.target.files[0])

此外，请确保URL有效！

const formData = new FormData();
const headers = {
'Authorization': "Bearer " + sessionStorage.getItem('loginToken'),
'Accept': 'application/json',
'Content-Type': 'multipart/form-data'
}
formdata.append('files[file]', e.target.files[0])
axios.post("http://localhost:3000/api/v1/upload_document", formData, {headers})