如何在 react-native 中将多张图片上传到 s3？答案

【问题标题】：How to upload multiple image to s3 in react-native?如何在 react-native 中将多张图片上传到 s3？
【发布时间】：2020-06-04 11:35:00
【问题描述】：

我从同事那里得到了存储桶名称、访问密钥、区域。

我想将图片上传到 s3 存储桶。

我该怎么做？

谢谢！

【问题讨论】：

这能回答你的问题吗？ React-native upload image to amazons s3

标签： amazon-web-services react-native

【解决方案1】：

嘿金光辉

你可以使用react-native-s3-upload包上传图片到s3桶。

   import { RNS3 } from 'react-native-s3-upload';

     constructor(props) {
    super(props)

    this.state = {
      amazonData: [],
      pictures:''
    }
  }
takePics = () => {

    ImagePicker.openPicker({
      multiple: true,
      maxFiles: 3
    }).then(response => {
      store.amazonData = [];
      let tempArray = []
      response.forEach((item) => {
        let image = {
          uri: item.path,
          width: item.width,
          height: item.height,
          name: item.filename,
          type: 'image/png'
        }
        const config = {
          bucket: 'goodvet',
          region: 'ap-northeast-2',
          accessKey: 'AKIAIJ4ZNXCKL6CIYIXQ',
          secretKey: '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',
          successActionStatus: 201
        }
        tempArray.push(image)

        RNS3.put(image, config)
          .then(responseFromS3 => {
            this.setState({ amazonData: [...this.state.amazonData, responseFromS3.body.postResponse.location] })

          })
      })
      this.setState({ pictures: tempArray })
      { this.hideIcons() }

    })
  }

takePicHandler() {
    return (
      <View>
          <SwiperFlatList
            showPagination={this.state.showsPagination}
            data={this.state.pictures}
            renderItem={({ item }) =>
              <View style={styles.uploadedImageView}>
                <Image
                  style={{ width: "100%", height: "100%" }}
                  source={item} />
      </View>
    )
  }

我希望这对你有用！ :)

谢谢！

【讨论】：

【解决方案2】：

您还应该检查来自 AWS 的 Amplify framework（例如 Storage.Put）。

【讨论】：