脚本和样式元素的 HTML "nonce" 属性的用途是什么？
What’s the purpose of the HTML "nonce" attribute for script and style elements?
W3C 表示 HTML5.1 中有一个名为 nonce 的新属性，用于 style 和 script，网站的内容安全策略可以使用该属性.
我在谷歌上搜索了一下，但最终还是没明白这个属性的实际作用以及使用它时会发生什么变化？
nonce 属性允许您将某些内联 script 和 style 元素“列入白名单”，同时避免使用 CSP unsafe-inline 指令（这将允许 all 内联 script/style)，因此您仍然保留一般禁止内联 script/style 的关键 CSP 功能。
所以 nonce 属性是告诉浏览器特定脚本或样式元素的内联内容不是由某些（恶意的）第三方注入到文档中，而是被放入文档中的方式由控制提供文档的服务器的人故意控制。
Web 基础知识 Content Security Policy article’s If you absolutely must use it ... 部分有一个很好的示例，说明如何使用 nonce 属性，包括以下步骤：
对于您的 Web 服务器收到的针对特定文档的每个请求，让您的后端从加密安全随机数生成器生成至少 128 位的随机 base64 编码字符串；例如，EDNnf03nceIOfn39fn3e9h3sdfa。那是你的随机数。
取第一步生成的随机数，对于任何内联script/style你想“白名单”，让你的后端代码插入一个nonce 在通过网络发送之前将属性添加到文档中，并将该随机数作为值：
<script nonce="EDNnf03nceIOfn39fn3e9h3sdfa">…</script>
将第 1 步中生成的随机数添加到 nonce- 前面，并让您的后端生成一个 CSP header，其中包含 [=27] 的源列表的值=] 或 style-src:
Content-Security-Policy: script-src 'nonce-EDNnf03nceIOfn39fn3e9h3sdfa'
因此，使用随机数的机制是一种替代方法，而不是让您的后端生成您想要允许的内联 script 或 style 内容的哈希值，然后指定该哈希值在您的 CSP header.
的相应来源列表中
注意：浏览器不会（不能）检查服务器发送的 nonce 值是否在页面请求之间实际发生变化；因此，有可能——尽管完全不可取——跳过上面的 1 并且不让你的后端为 nonce 做任何动态的事情，在这种情况下你可以将一个具有静态值的 nonce 属性放入 HTML 你的文档的来源，并发送一个具有相同随机数值的静态 CSP header。
但是您不想以这种方式使用静态随机数的原因是，它几乎完全违背了使用随机数的全部目的 — 因为，如果您要使用像这样的静态随机数，到那时你还不如使用 unsafe-inline.
至于哪些元素是“nonceable”：CSP 规范目前限制浏览器仅检查 script 和 style 元素的随机数。以下是规格详情：
在https://w3c.github.io/webappsec-csp/#match-element-to-source-list中，见第2步：
如果type是“script”或“style”，并且§6.6.3.1是元素nonceable ？ returns“一次性”…
在 https://w3c.github.io/webappsec-csp/#is-element-nonceable 处，Is element nonceable? 算法本身并不只检查 script/style 元素；但是规范调用的唯一地方是上面引用的部分，它将它限制为 script 和 style。因此，如果您将随机数放在任何其他元素上，当前规范要求浏览器忽略它。
W3C 表示 HTML5.1 中有一个名为 nonce 的新属性，用于 style 和 script，网站的内容安全策略可以使用该属性.
我在谷歌上搜索了一下，但最终还是没明白这个属性的实际作用以及使用它时会发生什么变化？
nonce 属性允许您将某些内联 script 和 style 元素“列入白名单”，同时避免使用 CSP unsafe-inline 指令（这将允许 all 内联 script/style)，因此您仍然保留一般禁止内联 script/style 的关键 CSP 功能。
所以 nonce 属性是告诉浏览器特定脚本或样式元素的内联内容不是由某些（恶意的）第三方注入到文档中，而是被放入文档中的方式由控制提供文档的服务器的人故意控制。
Web 基础知识 Content Security Policy article’s If you absolutely must use it ... 部分有一个很好的示例，说明如何使用 nonce 属性，包括以下步骤：
对于您的 Web 服务器收到的针对特定文档的每个请求，让您的后端从加密安全随机数生成器生成至少 128 位的随机 base64 编码字符串；例如，
EDNnf03nceIOfn39fn3e9h3sdfa。那是你的随机数。取第一步生成的随机数，对于任何内联
script/style你想“白名单”，让你的后端代码插入一个nonce在通过网络发送之前将属性添加到文档中，并将该随机数作为值：<script nonce="EDNnf03nceIOfn39fn3e9h3sdfa">…</script>将第 1 步中生成的随机数添加到
nonce-前面，并让您的后端生成一个 CSP header，其中包含 [=27] 的源列表的值=] 或style-src:Content-Security-Policy: script-src 'nonce-EDNnf03nceIOfn39fn3e9h3sdfa'
因此，使用随机数的机制是一种替代方法，而不是让您的后端生成您想要允许的内联 script 或 style 内容的哈希值，然后指定该哈希值在您的 CSP header.
注意：浏览器不会（不能）检查服务器发送的 nonce 值是否在页面请求之间实际发生变化；因此，有可能——尽管完全不可取——跳过上面的 1 并且不让你的后端为 nonce 做任何动态的事情，在这种情况下你可以将一个具有静态值的 nonce 属性放入 HTML 你的文档的来源，并发送一个具有相同随机数值的静态 CSP header。
但是您不想以这种方式使用静态随机数的原因是，它几乎完全违背了使用随机数的全部目的 — 因为，如果您要使用像这样的静态随机数，到那时你还不如使用 unsafe-inline.
至于哪些元素是“nonceable”：CSP 规范目前限制浏览器仅检查 script 和 style 元素的随机数。以下是规格详情：
在https://w3c.github.io/webappsec-csp/#match-element-to-source-list中，见第2步：
如果type是“script”或“style”，并且§6.6.3.1是元素nonceable ？ returns“一次性”…在 https://w3c.github.io/webappsec-csp/#is-element-nonceable 处，Is element nonceable? 算法本身并不只检查
script/style元素；但是规范调用的唯一地方是上面引用的部分，它将它限制为script和style。因此，如果您将随机数放在任何其他元素上，当前规范要求浏览器忽略它。