时间戳

首页 > 解决方案 > 上传包含一些数据的文件以响应 node.js 服务器

node.js - 上传包含一些数据的文件以响应 node.js 服务器

问题描述

我正在尝试在同一请求中发送数据并将图像上传到后端（Node.js），但是当我尝试上传图像时，在后端发现其他属性未定义。

const Imgdata = new FormData()
Imgdata.append('file', this.state.choiceImgUrl)

  axios.post("http://localhost:8080/api/choices/img", Imgdata, { 
     headers: { 'Content-type': 'application/json' },
     data:{ 
        id:this.state.id,
        username:this.state.username
     }
  })
  .then(res => {
     if(res.data.success){
        this.setState({ successUpload:true })
     }
     else {
        alert('error in upload data')
        this.setState({ Uploadloading:false })

     }
  })

和属性在后端未定义，如果我删除id，所有数据都成功传输，但没有文件。usernameImgdata

如何将文件连同一些数据上传到后端？

标签： node.jsreactjs

解决方案

在前端<->服务器之间发送数据可以以各种格式进行 - 在这种情况下，我推荐 [Form] （因为文件最终是二进制代码）

const formData = new FormData();
formData.append('key1', value1);
formData.append('key2', value2);

您的标头还应包括（而不是 application.json） -

Content-Type: multipart/form-data; boundary=something

https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Type

当您将整个结构打包到一个变量中时 - 只需将其作为参数传递给函数

randomService.uploadData(formData)

但也应该构建后端 - 接收特定值。

我正在拍摄该服务器当前接受应用程序/json - 所以我将你循环到另一个线程 -

如何在 NodeJS 中允许表单数据

推荐阅读