使用 React JS 从 S3 Bucket 中获取图像

Question

我一直在尝试从 s3 存储桶中获取图像以进行反应 UI，我的应用程序由 laravel 和反应组成，因此我能够为 [= 激活 s3 17=]，它起作用了，因为我能够将图像渲染到管理员端。

现在回到前端，react做的，一直觉得很难做，安装了

  "@aws-amplify/storage": "^1.1.2",
        "aws-amplify": "^1.1.40",
        "aws-amplify-react": "^2.4.4",
        "aws-config": "^1.3.2",

拜托，我真的需要帮助

Answer 1

我认为这个问题与您的依赖项没有任何关系，但与您的文件存储位置有关，如果您不调用存储文件的存储桶，您将无法获取它们

Answer 2

在从数据库调用图像目录之前，我可以通过添加 s3 URL 来解决这个问题。

片段；

<Image src={'http://innopizza.s3-eu-west-2.amazonaws.com/'+this.props.pizza.image} />

Answer 3

我遇到了同样的问题并解决了问题

<Image src={'http://innopizza.s3-eu-west-2.amazonaws.com/abc.jpg'} />

Answer 4

https://bucketname.s3.us-east-2.amazonaws.com/foldername/filename.png} alt="图片"/>

-桶及其所有对象必须是public

-您的对象的确切访问权限 link 是 aws 平台上的“objecturl”

Answer 5

这似乎对我有用

<img src="https://AWS-OBJECT-URL.s3.amazonaws.com/IMAGE-NAME.jpg" />

Fetch image from S3 Bucket using React JS