由于内容安全策略，加载 jQuery 时出错

Question

尝试使用 jquery（使用 Velocity 框架）时在控制台中出现此错误也尝试在本地加载，但这只会影响第一个错误。它出现在 Firefox 和 chrome 中。可以在安装了 CSP 禁用程序扩展的情况下完美运行我的所有 jquery。我曾尝试在本地使用 Jquery，但是这只修复了最上面的错误。 标题是：

<title>January 24th Data</title>
  <link rel="stylesheet" type="text/css" href="#{url_for_solr}/admin/file?file=/velocity/main.css&contentType=text/css"/>
  <link rel="stylesheet" href="#{url_for_solr}/admin/file?file=/velocity/jquery.autocomplete.css&contentType=text/css" type="text/css" />
  <link rel="icon" type="image/x-icon" href="#{url_root}/img/favicon.ico"/>
  <link rel="shortcut icon" type="image/x-icon" href="#{url_root}/img/favicon.ico"/>
  <script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.4.1.min.js"></script>

我也尝试过各种元标记，例如：

<meta http-equiv="Content-Security-Policy" content="default-src 'unsafe-inline' 'unsafe-eval' https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.4.1.min.js ">

和

<meta http-equiv="Content-Security-Policy" content="default-src 'self'"/>

两者都会产生错误

拒绝加载脚本“https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.4.1.min.js”，因为它违反了以下内容安全策略指令：“script-src 'self'”。请注意，'script-src-elem' 没有显式设置，因此 'script-src' 用作备用。

browse:14 拒绝执行内联脚本，因为它违反了以下内容安全策略指令：“script-src 'self'”。要启用内联执行，需要使用“unsafe-inline”关键字、哈希 ('sha256-EEZjyUio8FlS902ztJpL8uRYUNYVS1mLZ/8u4HDG/jE=') 或随机数 ('nonce-...')。

browse:17 拒绝执行内联脚本，因为它违反了以下内容安全策略指令：“script-src 'self'”。启用内联执行需要使用“unsafe-inline”关键字、哈希 ('sha256-LApJsdLo7vk6YtbqazNnR38dRhcyeKgEoa4zEa3XKrI=') 或随机数 ('nonce-...')。

browse:85 拒绝执行内联脚本，因为它违反了以下内容安全策略指令：“script-src 'self'”。启用内联执行需要使用“unsafe-inline”关键字、哈希（“sha256-8+TwCa2kVmht+Zv7JozUicDwebbcWW8Zui+wm+CicLY=”）或随机数（“nonce-...”）。

browse:2027 拒绝执行内联脚本，因为它违反了以下内容安全策略指令：“script-src 'self'”。启用内联执行需要“unsafe-inline”关键字、哈希（“sha256-Xl23u/E+jl0/+EjbGlC/oBQtvgkQ+6c83bxQ5f45NpU=”）或随机数（“nonce-...”）。

Answer 1

说明

Content Security Policy 是为防止在浏览器上执行未经验证的 javascript 代码而开发的方案。为了让您将scripts 包含到HTML 文件中，您需要向浏览器提供一种身份验证方法。

解决方案

主要有两种方法，一种是nonce，一种是hash。

随机数

nonce 是随机生成的字节序列，作为响应头发送到浏览器并附加到<script> 标记。当它们匹配时，script 被验证；因此它有资格被执行。

由于直接向 HTML 文件中插入随机字节比较困难，因此主要用于服务器端渲染（SSR）。我不确定它是否也可以用于客户端渲染（CSR）。

散列

此方法使用script 的哈希值进行完整性检查。这不需要插入到浏览器中，可以嵌入到响应头中。

例如，您想要来自CDN 的脚本，例如：

<script src="https://cdn.jsdelivr.net/npm/jquery@3.2.1/dist/jquery.min.js"></script>

那么您需要将script 的哈希值提供给响应标头。

您可以找到更多信息here。

如错误消息中所述，

拒绝加载脚本 'https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.4.1.min.js' 因为 它违反了以下内容安全政策指令： “脚本源代码‘自我’”。请注意，'script-src-elem' 没有明确 设置，所以 'script-src' 用作后备。

browse:14 拒绝执行内联脚本，因为它违反了 遵循内容安全策略指令：“script-src 'self'”。 'unsafe-inline' 关键字，哈希 ('sha256-EEZjyUio8FlS902ztJpL8uRYUNYVS1mLZ/8u4HDG/jE=')，或随机数 ('nonce-...') 是启用内联执行所必需的。

browse:17 拒绝执行内联脚本，因为它违反了 遵循内容安全策略指令：“script-src 'self'”。 'unsafe-inline' 关键字，哈希 ('sha256-LApJsdLo7vk6YtbqazNnR38dRhcyeKgEoa4zEa3XKrI=')，或随机数 ('nonce-...') 是启用内联执行所必需的。

browse:85 拒绝执行内联脚本，因为它违反了 遵循内容安全策略指令：“script-src 'self'”。 'unsafe-inline' 关键字，哈希 ('sha256-8+TwCa2kVmht+Zv7JozUicDwebbcWW8Zui+wm+CicLY=')，或随机数 ('nonce-...') 是启用内联执行所必需的。

browse:2027 拒绝执行内联脚本，因为它违反了 遵循内容安全策略指令：“script-src 'self'”。 'unsafe-inline' 关键字，哈希 ('sha256-Xl23u/E+jl0/+EjbGlC/oBQtvgkQ+6c83bxQ5f45NpU=')，或随机数 ('nonce-...') 是启用内联执行所必需的。

它说你必须使用随机数或哈希。

你可以像这样直接使用这些哈希值

<meta http-equiv="Content-Security-Policy" content="script-src-elem sha256-${HASH_VALUE} https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.4.1.min.js;" />