Firebase 存储桶中存储的图像未在 React 中加载

问题描述 投票:0回答:1

我有一个 MERN 应用程序,我将我的图像存储在 firebase 存储桶中

当我在不同端口上运行客户端和服务器时(在开发期间)它们正在工作,但是当我构建客户端并将它们作为静态文件提供时,它给了我以下错误。

拒绝加载图像'https://firebasestorage.googleapis.com/v0/b/My-Bucket-Name.appspot.com/o/images%2FHarry.jpeg?alt=media&token=“some-access-token” ' 因为它违反了以下内容安全策略指令:“img-src 'self' data:”。

我已将存储桶的读写权限设置为公共。

注意:它在开发期间工作,但当我使用express.static 提供静态文件时出现错误

我尝试在build文件夹的index.html文件中设置以下标签(我从chatGPT获取它),但它仍然不起作用:

<meta http-equiv="Content-Security-Policy" content="img-src 'self' data:; style-src 'self' 'unsafe-inline';">
reactjs firebase express firebase-storage
1个回答
0
投票

看起来内容安全策略直接阻止了图像加载。

尝试将元标记更改为

<meta http-equiv="Content-Security-Policy" content="img-src 'self' firebasestorage.googleapis.com; style-src 'self' 'unsafe-inline';">
© www.soinside.com 2019 - 2024. All rights reserved.