Question

我现在正在开发一个具有拍摄图像和上传功能的反应原生项目，我正在使用react-native-fetch-blob传递多部分数据来上传单个文件。但是，似乎没有将任何数据传递给我的api。

我也使用react-native-camera来捕捉图像。根据该模块的一些用法，我的项目能够通过调用此函数来捕获图像并显示图像。

this.camera.capture({ metadata: options })
  .then((data) => {
    console.log("image path: ", data.path);
  })
  .catch(err => console.error(err));

然后我得到了这样的结果，

image path: /var/mobile/Containers/Data/Application/.../AE1E52F0-8522-44D5-8603-21FB4EC9EAF9.jpg

所以我使用RNFetchBlob这个路径将图像发送到我的api，

RNFetchBlob.fetch(
  'POST', 
  [url], 
  {
    Authorization: jwtToken,
    'Content-Type': 'multipart/form-data'
  }, 
  [
    { 
      name: 'file',
      filename: 'AE1E52F0-8522-44D5-8603-21FB4EC9EAF9.jpg', 
      type: 'image/jpeg', 
      data: RNFetchBlob.wrap('/var/mobile/Containers/Data/Application/.../AE1E52F0-8522-44D5-8603-21FB4EC9EAF9.jpg') 
    }
  ]
).then((response) => {
  console.log("res: ", response.text());
})
.catch((error) => {
  console.log(error);
});

之后，我检查了我可以从我的API获取的请求，它显示如下：

{ 
    host: 'localhost:3000',
    connection: 'close',
    'content-type': 'multipart/form-data; charset=utf-8; boundary=RNFetchBlob1881293472',
    'user-agent': 'app/1 CFNetwork/811.5.4 Darwin/16.6.0',
    accept: '*/*',
    'accept-language': 'zh-tw',
    authorization: 'JWT eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VySWQiOiI1OTUxMzYxZDBkMTk3MjczNjNiMzRhN2EiLCJ1c2VyVHlwZSI6InVzZXIiLCJpYXQiOjE0OTg0OTQ1MTUsImV4cCI6MTQ5OTA5OTMxNX0.8vhDJtFugi4OQAJ48PTsBlAp8bw6x__KwOXvk6xuYW8',
    'content-length': '552434',
    'accept-encoding': 'gzip, deflate' 
}

但是我试着控制我的req.body，我得到了空对象{}。你能给我一些建议吗？谢谢〜

我正在使用“react-native-fetch-blob”：“^ 0.10.5”和“node”：“v6.10.2”

react-native-fetch-blob多部分数据图像上传问题

0 个答案: