JQuery 3.5.1 并拒绝执行内联脚本，因为它违反了以下内容安全策略指令：
Posted
技术标签:
【中文标题】JQuery 3.5.1 并拒绝执行内联脚本，因为它违反了以下内容安全策略指令：【英文标题】：JQuery 3.5.1 and Refused to execute inline script because it violates the following Content Security Policy directive: 【发布时间】：2021-07-26 08:26:05 【问题描述】：我将 jQuery 从 2.1.1 升级到 3.5.1，然后我开始看到 jQuery 的这个问题
拒绝执行内联脚本，因为它违反了以下内容 内容安全策略指令：“script-src 'self' 'nonce-YURLOAQRrIwdGEqYSSpHx9YSWDM......''unsafe-eval'”。 'unsafe-inline' 关键字，哈希 ('sha256-2mvMk0Nvn96VqS1UEmAZSVSEkK0CkPN....')，或随机数 ('nonce-...') 是启用内联执行所必需的。
我不想使用“不安全内联”。
在 2017-2018 年记录了该问题 here、here 和 here。我认为这个问题现在已经在 jQuery 3.5.1 中解决了，除非我遗漏了什么。
我的应用程序是在 .NET Core 5 中开发的。
Index.cshtml
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<script src="~/lib/jquery/3.5.1/jquery.min.js" asp-add-nonce="true"></script>
</head>
<body>
<button type="button" id="btnGetContent">Get Content</button>
<div id="result">
<partial name="_Test" />
</div>
<script src="~/js/index.js"></script>
</body>
</html>
_Test.cshtml 部分视图
@System.DateTime.Now.ToString();
<script type="text/javascript" asp-add-nonce="true">
// partial view specific inline script
</script>
index.js
$(function ()
$("#btnGetContent").click(function ()
$.ajax(
type: "GET",
url: "/test/getcontent",
processData: true,
cache: false
)
.done(function (response, textStatus, jqXHR)
// in browser's console I notice the error at this line
$("#result").html(response);
)
)
)
控制器
public class TestController : Controller
public IActionResult Index()
return View();
[HttpGet]
public IActionResult GetContent()
return PartialView("_Test");
CSP 政策
"default-src 'none'; script-src 'self' 'nonce-0' 'unsafe-eval'; style-src 'self' 'unsafe-inline'; img-src 'self' data:; font-src 'self'; connect-src 'self'; child-src 'self';"
我有自定义的asp-add-nonce 标签助手和一个随机数中间件。 ** 对于每个请求 ** 标签助手和中间件分别将新的 nonce 值注入到脚本标签和 CSP 策略中，并且一直运行良好。
在我将 jQuery 升级到 3.5.1 后，看起来 jQuery 在脚本标签中也需要 nonce 值，所以我在标头中添加了asp-add-nonce="true"，例如<script src="~/lib/jquery/3.5.1/jquery.min.js" asp-add-nonce="true"></script>
问题
我认为这里的问题是，由于为每个 http 请求创建了 nonce 值，并且 jQuery 每页仅加载一次。 Get Content 请求创建的新值当然与注入到 jQuery 脚本标签中的原始值不匹配。所以我们得到错误Refused to execute inline script...
有没有办法在不向 jQuery 的脚本标签添加 nonce 的情况下解决这个问题？
更新 1
查看浏览器提交的CSP报告后，发现了更多细节。违反的指令实际上是script-src-elem。我的 CSP 政策甚至没有该指令。该指令在 CSP 3 版本中可用。不知道为什么浏览器会因为这个指令在 jQuery 上出错。
更新 2 您可以download repository重新生成问题
【问题讨论】：
如错误消息所述，当您单击Get Content 按钮添加带有<script> 标记的局部视图时，它违反了以下内容安全策略指令。您可以考虑删除_TestPartialView部分视图中的<script>标签，并在home.js中添加相关脚本内容。在 home.js 文件中，文档准备好并加载部分视图后，附加相关事件和函数（来自 _TestPartialView <script> 标签）。
我们不能。这是现有的应用程序。有几个页面动态呈现部分视图，并且这些部分视图有自己的带有随机数的 script 标记。这在 JQ 更新到 3.5.1 之前有效
【参考方案1】：
根据我的相关问题here 和here，我想我必须添加script-src unsafe-inline 才能让jQuery 3.1+ 在以下场景中正常工作
1>您使用的是 jQuery 3.1+ 2>jQuery 被添加到 _layout 页面或主页上，所以它在开始时只加载一次。 3>您正在使用 AJAX 加载部分内容。
在nonce 方法中，建议对每个http 请求使用唯一的nonce。但他的方法在这里行不通。因为 AJAX 调用会在 header 中得到不同的 nonce。所以之后的任何 jQuery 调用都将不起作用。
对我来说，它使用的是 2.1.1，因为 jQuery 2.x parses all <script>...</script> tags from the HTML and puts it in a dynamically generated script tag or executes those through eval( ) details 而我有 script-src nonce-xyz unsafe-eval
【讨论】：
嗨，我也面临同样的问题。您是否刚刚删除了 nonce 表单 CSP 标头并添加了“不安全内联”？因为如果你同时添加两者，它会忽略'unsafe-inline'以上是关于JQuery 3.5.1 并拒绝执行内联脚本，因为它违反了以下内容安全策略指令：的主要内容，如果未能解决你的问题，请参考以下文章
拒绝执行内联脚本，因为它违反了以下内容安全策略指令：“script-src 'self'”
头盔导致 Heroku 上托管的 MERN 应用程序导致错误：拒绝执行内联脚本，因为它违反了以下内容
将 jQuery 插件导入 Angular 2+ 拒绝执行脚本，因为它的 MIME 类型（'text/html'）不可执行