Question

运行React应用时，我在chrome中遇到以下内容安全政策错误。我尝试使用谷歌搜索了很长时间，但是在使用create-react-app时找不到足够的信息来解决此问题。非常感谢您的帮助。

enter image description here

Answer 1

在仔细搜索了您的问题后，我最终得到了here in MDN。我将在短期内定义问题所在，但强烈建议您阅读所提供的链接以获取更多信息。

那么这里到底发生了什么？

这是因为该网站配置为使用内容安全策略（CSP）来防止有人恶意从第三方加载代码。 Content-Security-Policy元标记允许您定义可以从何处加载资源，从而防止浏览器从任何其他位置加载数据，从而降低XSS攻击的风险。这使攻击者更难将恶意代码注入您的网站。

那如何解决呢？

根据我提供的MDN链接，我们应该通过在index.html上添加以下元标记来解决此问题。

<meta http-equiv="Content-Security-Policy" content="default-src 'self' *.trusted.com">

注意：：*.trusted.com应该是受信任的站点或它们的列表。

我遇到了像您这样的问题，然后才发现该错误何时出现在您的控制台上，这并不一定表明您的项目中确实存在这个问题，而主代码中的其他问题可能会导致这种情况。错误。我刚刚发现了一些类似的问题，将在下面分享：

首先，请检查项目中所有现有的代码和路径，并确保两者均无错误。当您摆脱所有错误后，该错误将照常消失，但是如果问题仍然存在，请确保禁用浏览器中的所有扩展（您可以在隐身状态下安全地对其进行测试而无需禁用任何功能），然后运行该项目并查看错误是否消失。

因此，完全可以通过两个步骤来消除它：