错误阻止加载jquery.js-内容安全策略

jucafojl  于 2021-09-29  发布在  Java
关注(0)|答案(1)|浏览(711)

加载应用程序时出现以下错误:

Content Security Policy: The page’s settings blocked the loading of a resource at inline (“script-src”). jquery-3.6.0.js:6333:7

代码在这一行:

if ( elem.nodeType === 1 ) {
      jQuery.cleanData( getAll( elem, false ) );
      elem.innerHTML = value;    // this line is causing issue
  }

我的csp标题:

add_header Content-Security-Policy    "default-src 'self' data: blob: ;
                                        script-src 'self' data: blob: 'nonce-2726c7f26c';
                                        style-src 'self' data: blob: ;
                                        img-src 'self' ;
                                        form-action 'self' ;
                                        frame-ancestors 'self' ;" always;

我也尝试使用“nonce”,但它不起作用。

<script src="js/jquery-3.6.0.js" nonce="2726c7f26c"></script>

我不想使用“不安全内联”。
有人能帮我解决这个问题吗?我花了两天时间在谷歌上搜索,但都没有结果。提前谢谢。
更新1:在chrome中,将出现以下错误:
jquery-3.6.0.js:6262拒绝应用内联样式,因为它违反了以下内容安全策略指令:“style src'self'数据:blob:'nonce-2726c7f26c'”。启用内联执行需要'unsafe inline'关键字、哈希('sha256-1pxudspygk6n+lzsmv0gg4lmx3i3xigg6h0czpijwre=')或nonce('nonce-…')。
(匿名)@jquery-3.6.0.js:6262 dommanip@jquery-3.6.0.js:6089 prepend@jquery-3.6.0.js:6259(匿名)@angular.min.js:315
:81/uploadgrp:1拒绝执行内联事件处理程序,因为它违反了以下内容安全策略指令:“script src'self'data:blob:'nonce-2726c7f26c'”。启用内联执行需要'unsafe inline'关键字、哈希('sha256-…')或nonce('nonce-…')。请注意,哈希不适用于事件处理程序、样式属性和javascript:navigations,除非存在“不安全哈希”关键字。
代码行jquery-3.6.0.js:6262:

if ( this.nodeType === 1 || this.nodeType === 11 || this.nodeType === 9 ) {
     var target = manipulationTarget( this, elem );
     target.insertBefore( elem, target.firstChild ); //this line is causing issue.
}
kfgdxczn

kfgdxczn1#

jQuery3.6将“nonce-value”重新分配到它注入的所有内联脚本中,包括 scriptAttrs: {nonce: "value"} 归属于 $.ajax() . 因此,该行: elem.innerHTML = value; // this line is causing issue 包含内联事件处理程序(例如 <tag onclick='...' )或javascript导航(例如 <a href='javascript:void()' )甚至 <script>...</script> 在“价值”中。
firefox浏览器没有太多的细节来区分这些类型的内联脚本,但是chrome会更明确地描述违规行为( Refused to execute inline script / Refused to execute inline event handler / Refused to run the JavaScript URL ). 因此,使用chrome,你可以切碎一盏灯,看看发生了什么。
或者,您可以使用内容安全策略(csp)的报告功能-添加 'report-sample' 代币 script-src 指令和添加 report-uri https://url_to_handle_reports; csp结束时的指令(例如,您可以临时使用https://report-uri.com,或使用一些node.js包来处理违规报告)。
用一个 'report-sample' 令牌您将获得由代码引起的违规示例(前40个字符)。
在识别导致冲突的代码后,您可以尝试修复它。

附加chrome控制台消息后更新
jquery-3.6.0.js:6262拒绝应用内联样式,因为它违反了以下内容安全策略指令:“style src'self'数据:blob:'nonce-2726c7f26c'”。“unsafe inline”关键字或散列('sha256-1pxudspygk6n+lzsmv0gg4lmx3i3xigg6h0czpijwre='))。。。
“sha256-1pxudspygk6n+lzsmv0gg4lmx3i3xigg6h0czpijwre=”散列与 <style> 有Angular 的框架。
jquery不会重新分发 'nonce-value' 从脚本到样式。无论如何,需要 'unsafe-inline'style-src 指令-请参阅建议的步骤:1.我们应该明确指出,对于Angular 应用程序,在样式src中允许“不安全内联”。
:81/uploadgrp:1拒绝执行内联事件处理程序,因为它违反了以下内容安全策略指令:“script src'self'data:blob:'nonce-2726c7f26c'”。“不安全内联”关键字、哈希('sha256-…')。。。
您可以像这样插入内联事件处理程序 elem.innerHTML = "<div onclick='...'" . 这需要 'unsafe-inline''script-src' ,因为内置事件处理程序包含在 'unsafe-hashes' 令牌,但safari不支持它。
如果您可以更改逻辑并使用 addEventListener 要附加事件处理程序,请执行以下操作:

document.querySelector("#element-id").addEventListener("click", function() {...do something...} );

你可以避免使用 'unsafe-inline' 在里面 script-src .
顺便说一句:您可以使用一段代码来定义阻止的事件处理程序:

if ('SecurityPolicyViolationEvent' in window)
  document.addEventListener('securitypolicyviolation', (e) => {
     console.log(e.sample + '` in `' + e.violatedDirective + '`');
  } );
else console.log('SecurityPolicyViolationEvent unsupported');

相关问题