react-native - react-native 上传图片 react-native-fetch-blob

Question

我正在尝试将文件从移动设备（iOS 和 Android）上传到 Amazon S3。

我使用 react-native-fetch-blob 尝试了各种方法。

最新的想法是使用 react-native-fetch-blob readfile

RNFetchBlob.fs.readFile(image.path, 'base64').then(data => //在这里上传 );

但不幸的是，这会上传文件的 base64 版本，该文件不会显示在网络上。

如何上传简单的图像？

标签： react-native

Answer 1

这段代码对我有用：

RNFetchBlob.fetch(
  'POST',
  `${BASE_URL}vehicle/vehicleRegistration`,
  {
    Authorization: 'Bearer ' + authToken,
    'Content-Type': 'multipart/form-data,octet-stream',
  },
  [
    {
      name: 'photo',
      filename: 'vid.mp4',
      data: RNFetchBlob.wrap(vehicleImage.uri),
    },
    {
      name: 'email',
      data: user.email,
    },
    {
      name: 'userId',
      data: user.id,
    },
    {
      name: 'vehicleType',
      data: values.vehicleType,
    },
    {
      name: 'make',
      data: values.make,
    },
    {
      name: 'buildYear',
      data: values.buildYear,
    },
    {
      name: 'model',
      data: values.model,
    },
    {
      name: 'nickName',
      data: values.nickName,
    },
    {
      name: 'engineSize',
      data: values.engineSize,
    },
  ],
)
  .uploadProgress((written, total) => {
    console.log('uploaded', written / total);
  })
  .then(response => response.json())
  .then(RetrivedData => {
    console.log('---retrieved data------', RetrivedData);
    Toast.show({
      text1: 'Success',
      text2: 'Vehicle Added to Garage!',
      type: 'success',
    });
  })
  .catch(err => {
    console.log('----Error in adding a comment----', err);
    Toast.show({
      text1: 'Request Failed',
      text2: err?.response?.data?.message,
      type: 'error',
    });
  });