我正在开发一个使用 img
标签嵌入图像的 React 应用程序。有些图片没有加载,出现 403 错误:
但是,它在另一个 Chrome 标签页上加载正常:
这是检查后的图像标签:
解决这个问题的方法是什么?
最佳答案
服务器检查浏览器发送的referer,当referer来自不同域时,服务器不会返回图片。
为防止这种情况,在当前的许多浏览器中,您可以使用 img
标记的 referrerpolicy
属性来要求浏览器不要发送 referer:
<img referrerPolicy="no-referrer" src="https://www.host.net/image.png" />
关于 React 的注意事项:在 React 中使用它时,我发现它只有在 referrerPolicy
属性拼写为大写 P 并出现在 src 属性之前时才能可靠地工作。
请注意,除了技术方面,还有法律方面的问题。链接到不同主机上的资源可能会在损害赔偿责任和知识产权问题方面产生法律后果。请确保您可以链接到不同主机上的这些资源。
关于javascript - 图片在 Chrome 选项卡上加载正常,但在 React 代码中返回 403,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53536329/