拒绝加载脚本，因为它违反了以下内容安全策略指令。

Question

拒绝加载脚本，因为它违反了以下内容安全策略指令。

javascripthtmlcsscontent-security-policy

6

所有外部引入的脚本都出现了以下错误:

拒绝加载脚本'https://code.jquery.com/jquery-3.4.1.slim.min.js'，因为它违反了以下内容安全策略指令："script-src 'self' https://xxxx.com https://ajax.googleapis.com 'sha256-V8KVL4e3S2PwNnwHfycBcJMRnRhyyPiEpdxcGNLxzvk='"。请注意，“script-src-elem”未明确设置，因此会使用' script-src '作为后备。

我搜索了这个错误，但所有的解决方案都有'unsafe-eval' 'unsafe-inline'。

据我的理解，我需要编写一个标签。就像这样:

<meta http-equiv="Content-Security-Policy" content="default-src *; style-src 'self' http://* 'unsafe-inline'; script-src 'self' http://* 'unsafe-inline' 'unsafe-eval'" />

我已经去除了不安全的内联（unsafe-inline）和不安全的求值（unsafe-eval），但问题仍然存在。你有任何想法吗？

这是我的头部信息内容：

<head>
    <link rel="icon" href="img/am.png">
    <meta charset="utf-8">
    <!-- Required meta tags -->
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <script src="https://use.fontawesome.com/releases/v5.0.6/js/all.js"></script>
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css"
        integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
    <link href="https://fonts.googleapis.com/css?family=Montserrat:300,600,700i" rel="stylesheet">
    <link rel="stylesheet" href="style.css">

    <title>Title</title>

</head>

在我的闭合body标签之前，还有更多的已包含脚本。

<script src="https://code.jquery.com/jquery-3.4.1.slim.min.js"
    integrity="sha384-J6qa4849blE2+poT4WnyKhv5vZF5SrPo0iEjwBvKU7imGFAV0wwj1yYfoRSJoZ+n"
    crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js"
    integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo"
    crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"
    integrity="sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6"
    crossorigin="anonymous"></script>

总共有四个脚本被阻止。其中一个是在头部的(frontawesome)，另外三个脚本位于闭合body标签之前。

- M. Guerrero

你如何加载脚本？ - Itamar

1

我更新了我的问题，并说明了我如何加载这些脚本。有4个脚本被阻止了。 - M. Guerrero

2个回答

0

你可能除了 meta 标签 CSP 之外还设置了 CSP 响应头。多个 CSP 只会使其更加严格，因为所有内容都必须通过两个 CSP。你需要修改头部的 CSP 并将 code.jquery.com 添加到 script-src 中。

- Halvor Sakshaug

我的头部或任何元标记CSP中都没有任何CSP响应。我更新了我的问题，展示了我的头部内容以及我如何加载脚本。 - M. Guerrero

你应该包含响应头，你可以在开发者工具的网络选项卡中找到它们。它应该看起来像这样：https://developer.mozilla.org/zh-CN/docs/Glossary/Response_header - Halvor Sakshaug

当我查看网络选项卡时，脚本显示Referrer Policy: no-referrer-when-downgrade。我应该在哪里添加响应头？ - M. Guerrero

引荐政策（Referrer Policy）是一个无关的头部信息。如果相关响应中有任何内容安全策略（Content-Security-Policy）头部信息，您应将它们添加到您的问题中。 - Halvor Sakshaug

@M. Guerrero，在这里有一个教程，可以了解CSP HTTP响应头的问题。 - granty

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- granty · Accepted Answer

script-src 'self' https://xxxx.com https://ajax.googleapis.com 'sha256-V8KVL4e3S2PwNnwHfycBcJMRnRhyyPiEpdxcGNLxzvk='

这意味着你的CMS（或服务器）已经以某种方式发出了内容安全策略：

PHP header() 函数
.htaccess 文件
< meta http-equiv="Content-Security-Policy")
Web 服务器配置（低概率）

你需要找到它在哪里完成的（在 CMS 中应该有一个插件来管理头文件）。然后添加到 script-src 指令中：

要么使用主机源（如果CDN带有公共上传，则不太安全）：

https://use.fontawesome.com https://code.jquery.com https://cdn.jsdelivr.net https://stackpath.bootstrapcdn.com
要么使用脚本完整性属性的单引号哈希值（更安全）：

'sha384-J6qa4849blE2+poT4WnyKhv5vZF5SrPo0iEjwBvKU7imGFAV0wwj1yYfoRSJoZ+n' 'sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo' 'sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6' 'sha384-0AJY8UERsBUKdWcyF3o2kisLKeIo6G4Tbd8Y6fbyw6qYmn4WBuqcvxokp8m2UzSD'
要么混合使用：

'sha384-J6qa4849blE2+poT4WnyKhv5vZF5SrPo0iEjwBvKU7imGFAV0wwj1yYfoRSJoZ+n' 'sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo' 'sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6' https://use.fontawesome.com

在第二个选项中，您需要在head部分的脚本中添加integrity=属性：

<script src="https://use.fontawesome.com/releases/v5.0.6/js/all.js"
integrity="sha384-0AJY8UERsBUKdWcyF3o2kisLKeIo6G4Tbd8Y6fbyw6qYmn4WBuqcvxokp8m2UzSD"
  crossorigin="anonymous"></script>

更新： 第三个选项（混合规则）是为了在无法更改下面脚本中的 <head> 部分（完整性属性添加）的情况下添加的：

<script src="https://use.fontawesome.com/releases/v5.0.6/js/all.js"></script>