通过React Native Debugger发出具有multipart / form-data的axios POST请求

Question

我正在尝试从React Native将文件上传到我的服务器。但是我无法将'Content-Type'标题设置为multipart/form-data。

这是我的简单要求：

axios({
  uri: 'http://localhost:3000',
  method: 'POST',
  data: formData,
  headers: {
    Accept: 'application/json',
    'Content-Type': 'multipart/form-data'
  }
});

我正在使用React Native Debugger监视网络请求。

当我在调试器中看到我的网络请求时，我看到以下内容：

'Content-Type': 'text/plain;charset=UTF-8'

并且请求有效载荷很简单 [object Object]

用户代理： Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_6) AppleWebKit/537.36 (KHTML, like Gecko) ReactNativeDebugger/0.7.13 Chrome/58.0.3029.110 Electron/1.7.9 Safari/537.36

如果我无法使用React Native Debugger做到这一点，那么谁能建议通过Expo进行测试的任何步骤。

Answer 1

使用最新版本的Axios（0.17.1），您可以'Content-Type': 'multipart/form-data'在标头中发出一个HTTP请求，如下所示：

const formData = new FormData();
formData.append('action', 'ADD');
formData.append('param', 0);
formData.append('secondParam', 0);
formData.append('file', new Blob(['test payload'], { type: 'text/csv' }));
axios({
  url: 'http://localhost:5000/api/hello',
  method: 'POST',
  data: formData,
  headers: {
    Accept: 'application/json',
    'Content-Type': 'multipart/form-data'
  }
})

两件事：我正在使用url，而不是uri。另外，请插入您自己的表单数据和网址。检查已成功答复的请求，这是我获得的请求标头：