使用axios的react native上传文件的问题

问题描述 投票:0回答:1

我试图在react-native应用程序中使用axios作为http处理程序将文件上传到服务器,我的代码如下。

let promises = [];
     const body = new FormData();
      console.log(body);
      body.append('device_name', this.state.deviceInfo.DeviceName);
      body.append('device_id', this.state.deviceInfo.DeviceID);
      body.append('device_ip', this.state.deviceInfo.DeviceIP);
      body.append('device_os', this.state.deviceInfo.DeviceOS);
      body.append('upload_type', 'user');
      body.append('user_name', user.Email);
      body.append('file1', {
        uri: this.state.newImageUrl.uri,
        name: 'test.jpg',
        type: 'image/jpg',
      });

      promises.push(
        apiUploadDocs(body)
          .then(res => {
            profileImageName = res[0].NewFileName;
          })
          .catch(err => {
            console.log('this error', err);
          }),
      );

我的apiUploadDocs是:

 export const apiUploadDocs = body => {
  return new Promise((resolve, reject) => {
    axios
      .post(ApiRoutes.uploadDocs, body,{headers:{'content-Type': `multipart/form-data`}})
      .then(res => {
        console.log('upload success');
        console.log(res);
      })
      .catch(err => {
        console.log('upload error', err);
        if (err.response) {

        }
        reject(Constant.network.networkError);
      });
  });
};

当我尝试从Postman上传文件时,每个分配的变量都有正确的值,而且api工作良好。但是这段代码在这里导致了一个错误,即 undefined 我试过按照stackoverflow上的一些建议,把uri中的'file:/'删掉,我想不通。你能帮我找到这里有什么问题吗?

PS:登录时的正文是。

{
  "_parts":[
      [
         "device_name",
         "sdk_gphone_x86"
      ],
      [
         "device_id",
         "xxxxxxxxxxxxx"
      ],
      [
         "device_ip",
         "10.0.2.xx"
      ],
      [
         "device_os",
         "goldfish_x86"
      ],
      [
         "upload_type",
         "user"
      ],
      [
         "user_name",
         "[email protected]"
      ],
      [
         "file1",
         [
            "Object"
         ]
      ]
   ]
}

如果它是任何参考。

react-native file-upload request axios react-native-android
1个回答
0
投票

我找到了一个在react-native中上传图片的链接。https:/aboutreact.comfile-upload-in-react-native。这也许对你有一些帮助。

let uploadImage = async () => {
    //Check if any file is selected or not
    if (singleFile != null) {
      //If file selected then create FormData
      const fileToUpload = singleFile;
      const data = new FormData();
      data.append('name', 'Image Upload');
      data.append('file_attachment', fileToUpload);
      let res = await fetch(
        'http://localhost//webservice/user/uploadImage',
        {
          method: 'post',
          body: data,
          headers: {
            'Content-Type': 'multipart/form-data; ',
          },
        }
      );
      let responseJson = await res.json();
      if (responseJson.status == 1) {
        alert('Upload Successful');
      }
    } else {
      //if no file selected the show alert
      alert('Please Select File first');
    }
};
© www.soinside.com 2019 - 2024. All rights reserved.