React JS 拒绝加载图像，因为它违反了以下内容安全策略指令 [英] React JS Refuse to load the image because it violates the following Content Security Policy directive
问题描述
当我尝试重新加载我的 React 应用程序网页时遇到了这个问题.注意:在开发阶段，这种事情没有问题，但是当我将它部署到生产中时，我遇到了这个问题.谢谢你.
I faced this problem when I try to reload my react application web page. Note: In the development phase there was no issue with this kind of thing, but when I deploy it to production I faced this issue. Thank you.
Refused to load the image 'http://104.248.153.121:8080/favicon.ico' because it violates the following Content Security Policy directive: "default-src 'none'". Note that 'img-src' was not explicitly set, so 'default-src' is used as a fallback.
这是一个错误图像日志:错误日志拒绝加载图像
Here is an error image log: Error Log Refuse to load image
推荐答案
Content-Security-Policy 元标记允许您定义可以从何处加载资源，从而防止浏览器从从任何其他位置加载数据.这使攻击者更难将恶意代码注入您的网站.
The Content-Security-Policy meta-tag allows you to reduce the risk of XSS attacks by allowing you to define where resources can be loaded from, preventing browsers from loading data from any other locations. This makes it harder for an attacker to inject malicious code into your site.
表示 content="default-src 'self'" 的示例意味着:
Sample that says content="default-src 'self'" means this:
<meta http-equiv="Content-Security-Policy" content="default-src 'self'">
- 如何允许多个来源?
您可以简单地在指令后以空格分隔列表的形式列出您的来源:
You can simply list your sources after a directive as a space separated list:
content="default-src 'self' https://example.com/js/"
请注意，除了特殊参数(如self")之外，参数周围没有引号.此外，指令后没有冒号 (:).只是指令，然后是空格分隔的参数列表.
Note that there are no quotes around parameters other than the special ones, like 'self'. Also, there's no colon (:) after the directive. Just the directive, then a space-separated list of parameters.
这篇关于React JS 拒绝加载图像，因为它违反了以下内容安全策略指令的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
