React native React本机将jpg文件上载到s3

我一直在尝试将一个文件上传到S3——要求是，无论是Android还是iOS，该文件都可以通过web读取（即，是一个普通的jpeg文件）

我尝试使用react native fetch blob和

RNFetchBlob.fs.readFile（image.path，'base64'），但没有成功
但我能上传的只是该文件的baset64表示

这是不可接受的，因为web界面无法以本机方式读取

有什么想法吗？
这个函数对我有用，希望对我有所帮助

async function uploadFile(signed_url, uri, fileName, fileType, callback) {
    const xhr = new XMLHttpRequest();
    xhr.open('PUT', signed_url);
    xhr.setRequestHeader('Content-Type', fileType);
    xhr.onreadystatechange = () => {
        if (xhr.readyState === 4) {
            if (xhr.status === 200) {
                console.log(log_sign, "upload success");
                callback(xhr.status)
            }
        }
    };
    xhr.send({uri: uri, type: fileType, name: fileName})
};

这个函数对我有用，希望对我有所帮助

async function uploadFile(signed_url, uri, fileName, fileType, callback) {
    const xhr = new XMLHttpRequest();
    xhr.open('PUT', signed_url);
    xhr.setRequestHeader('Content-Type', fileType);
    xhr.onreadystatechange = () => {
        if (xhr.readyState === 4) {
            if (xhr.status === 200) {
                console.log(log_sign, "upload success");
                callback(xhr.status)
            }
        }
    };
    xhr.send({uri: uri, type: fileType, name: fileName})
};

使用aws3库的步骤

使用命令npm Install--save react-native-aws3安装aws3 react本机库

使用以下代码作为模板上传jpg

import { RNS3 } from 'react-native-aws3';

// No need to convert to Base 64. You can directly upload the image.
const imageFile = {
  uri: `file://${image.path}`,
 name: "image.png",
 type: "image/png"
}

// Replace your s3 configuration here. Also move this to separate file for better use.
const options = {
  keyPrefix: "uploads/",
  bucket: "your-bucket",
  region: "us-east-1",
  accessKey: "your-access-key",
  secretKey: "your-secret-key",
  successActionStatus: 201
}

RNS3.put(imageFile, options).then(response => {
  if (response.status !== 201) throw new Error("Failed to upload image to S3");

  console.log(response.body);
  /**
  * {
  *   postResponse: {
  *     bucket: "your-bucket",
  *     etag : "9f620878e06d28774406017480a59fd4",
  *     key: "uploads/image.png",
  *     location: "https://your-bucket.s3.amazonaws.com/uploads%2Fimage.png"
  *   }
  * }
  */
});


此外，还有一个用于react本机调用react-native-s3的本机库。如果您也想查看它。
使用aws3库的步骤

使用命令npm Install--save react-native-aws3安装aws3 react本机库

使用以下代码作为模板上传jpg

import { RNS3 } from 'react-native-aws3';

// No need to convert to Base 64. You can directly upload the image.
const imageFile = {
  uri: `file://${image.path}`,
 name: "image.png",
 type: "image/png"
}

// Replace your s3 configuration here. Also move this to separate file for better use.
const options = {
  keyPrefix: "uploads/",
  bucket: "your-bucket",
  region: "us-east-1",
  accessKey: "your-access-key",
  secretKey: "your-secret-key",
  successActionStatus: 201
}

RNS3.put(imageFile, options).then(response => {
  if (response.status !== 201) throw new Error("Failed to upload image to S3");

  console.log(response.body);
  /**
  * {
  *   postResponse: {
  *     bucket: "your-bucket",
  *     etag : "9f620878e06d28774406017480a59fd4",
  *     key: "uploads/image.png",
  *     location: "https://your-bucket.s3.amazonaws.com/uploads%2Fimage.png"
  *   }
  * }
  */
});


此外，还有一个用于react本机调用react-native-s3的本机库。如果你想也去看看