首页 > 解决方案 > 'self' 脚本被阻止加载,但是当我使用 nonce 时它们可以工作吗?

问题描述

可能有一个简单的解决方案,但我无法弄清楚。

我有一个这样定义的 CSP:

"Content-Security-Policy: default-src * 'unsafe-inline' 'unsafe-eval' data: blob:; style-src 'unsafe-inline' 'self' cdnjs.cloudflare.com fonts.googleapis.com; script-src www.google-analytics.com cdnjs.cloudflare.com 'self' 'nonce-". $_SESSION['nonce'] . "'; img-src * 'self' data:;object-src 'self' sias.dev:8000; connect-src * 'unsafe-inline'; frame-src 'self' sias.dev:8000 www.google.com;"

CSP 需要稍作调整,但可以部分工作。我需要一个随机数,因为我有一些带有一些内联脚本的旧网站。随机数是动态生成的,并在页面加载时更改。但是,我遇到了一个问题,我在通过 AJAX 调用的页面上加载了一些“自我”脚本(不是内联,而是脚本 src 标签。这可能是不好的做法,但我不想加载那些除了通过 ajax 调用的页面。

奇怪的是我在那个页面上没有任何内联脚本,只有像下面这样的脚本 src 标签,其中 nonce 是动态的并且与 CSP 策略中的匹配。

<script nonce = "" src="/js/create_dicom/js/plupload.full.min.js"></script>
<script nonce = "" src="/js/create_dicom/js/jquery.ui.plupload.min.js"></script>
<script nonce = "" src="/js/create_dicom/js/main.js"></script>
<script nonce = "" src="/bower/pdfjs/src/pdf.js"></script>
<script nonce = "" src="/bower/pdfjs/src/pdf.worker.js"></script>

当我不使用随机数时,我得到:

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

当我确实使用随机数时,它们可以正常加载并且页面可以正常工作。我认为您只需要内联脚本的随机数而不是“自我”脚本。我应该以某种方式使用严格动态吗?我不需要在 script-src 标签的主页中使用随机数。他们在那里加载好吗?

此外,我需要 nonce 的地方主要是通过 AJAX 加载的页面。有没有办法重构东西(即把它们放在 .js 文件中并以这种方式加载相关的 .js )。这有点痛苦,因为我没有脚本加载器,我只想为通过 AJAX 加载的文件加载相关的 js。

谢谢。

标签: javascriptajaxcontent-security-policynonce

解决方案


  1. 控制台错误:The page’s settings blocked the loading of a resource at INLINE那么你肯定有一个内联脚本被阻止而不是外部,因此它与“自我”无关。您可以查看控制台角落并查看script_name:line_number:column发生的位置。
    在 lock externall 脚本的情况下,错误看起来像:The page’s settings blocked the loading of a resource at HTTPS://EXAMPLE.COM/PATH/SCRIPT.JS.

  2. 可能是 3 种内联脚本<script>...<script>和. Firefox 不区分这些,Chrome 比较冗长,所以看看它在 Chrome 浏览器中这个错误的样子。 有 2 个选项:Chrome 中没有错误 - 这很好,FF 因误报违规而已知Chrome 中有错误 - 你有一个内联脚本,Chrome 会准确说出哪个。<a href='javascript:void(0)'<a onclick='evtHandler()'

    -
    -

  3. 通过浏览器控制台日志调整 CSP 是不好的做法。您使用pdf.min.js,但此脚本包含一段代码:

const n = document.createElement("script");
n.src = e;
n.onload = t;
n.onerror = function() {
r(new Error("Cannot load script at: " + n.src))
};
(document.head || document.documentElement).appendChild(n)

这意味着可以在某些条件下加载一些外部脚本。只有上帝知道你需要按什么才能发生这种情况以及从哪里加载这个脚本。
因此,正确的方法(如果网站有访问者)是使用该report-uri指令并在大约 2 周内分析违规报告。

PS:只是好奇-您指定:connect-src * 'unsafe-inline';所以您在某处确实有内联脚本?顺便说一句,connect-src指令中没有使用“unsafe-inline”标记,它将被忽略。


推荐阅读