在 React-Native 中使用 AWS Amplify 显示来自 S3 的图像

Question

我无法渲染图像。我将受保护的图像上传到 S3，没问题。然后我使用下面的代码来检索图像。当我登录 imageReturn 时，我得到带有令牌的图像 URL。

state = {
    image: ''
}

async getImage(image) {
    let imageReturn = await Storage.get('9807139f-e5b4-428e-8dfb-d7cfeebe87ab.jpeg')
    this.setState({
        image: imageReturn
    })
}

我尝试用两种不同的方式渲染图像，使用 react-native 的图像和 'aws-amplify-react-native' S3Image。

<Image source={this.state.image} style={{ width: 100, height: 100 }}/>

和

<S3Image key={'9807139f-e5b4-428e-8dfb-d7cfeebe87ab.jpeg'} />

感谢任何帮助。谢谢！

Answer 1

AWS get return image URL, Image URL printing 必须添加 uri 。请重新连接您的代码 Snippest 是

<Image source={uri:this.state.image} style={{ width: 100, height: 100 }}/>

在 React-Native 中使用 AWS Amplify 显示来自 S3 的图像

Display Image from S3 with AWS Amplify in React-Native

amazon-s3

amazon-web-services

react-native

aws-amplify