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

【问题标题】：react-native upload image react-native-fetch-blobreact-native 上传图片 react-native-fetch-blob
【发布时间】：2018-11-24 03:08:31
【问题描述】：

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

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

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

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

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

如何上传简单的图片？

【问题讨论】：

很多解决方案github.com/g6ling/React-Native-Tips/blob/master/…
谢谢。那就是我得到readFile的地方，不幸的是我找不到任何允许我上传为JPEG文件（例如）而不是编码为Base64的JPEG。我需要能够在网络浏览器中显示生成的文件。

标签： react-native

【解决方案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',
    });
  });

【讨论】：