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
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
|
---
title: Headers
slug: Web/API/Headers
tags:
- Headers
- Headers API
- application/json
- 头信息
translation_of: Web/API/Headers
---
<p>{{ APIRef("Fetch") }}</p>
<p><a href="/en-US/docs/Web/API/Fetch_API">Fetch API</a> 的 <strong>Headers </strong>接口允许您对HTTP请求和响应头执行各种操作。 这些操作包括检索，设置，添加和删除。 一个Headers对象具有关联的头列表，它最初为空，由零个或多个键值对组成。你可以使用<span style="line-height: 19.0909080505371px;"> </span>{{domxref("Headers.append","append()")}} <span style="line-height: 19.0909080505371px;">方法添加 </span>之类的方法添加到此(参见 <a href="#示例">示例</a>)。在该接口的所有方法中，标题名称由不区分大小写的字节序列匹配。</p>
<p>出于安全考虑，某些头只能由用户代理控制。这些头信息包括 {{Glossary("Forbidden_header_name", "forbidden header names", 1)}} 和 {{Glossary("Forbidden_response_header_name", "forbidden response header names", 1)}}。</p>
<p>一个Headers对象也有一个关联的guard，它具有不可变的值，<code>request</code>，<code>request-no-cors</code>，<code>response</code>或<code>none</code>。 这会影响 {{domxref("Headers.set","set()")}}, {{domxref("Headers.delete","delete()")}}, 和{{domxref("Headers.append","append()")}} 方法 改变header. 参考更多信息,请看 {{Glossary("Guard")}}.</p>
<p>你可以通过 {{domxref("Request.headers")}} 和{{domxref("Response.headers")}} 属性检索一个<code>Headers</code>对象, 并使用 {{domxref("Headers.Headers()")}} 构造函数创建一个新的<code>Headers</code> 对象.</p>
<p>一个实现了<code>Headers</code> 的对象可以直接用于 {{jsxref("Statements/for...of", "for...of")}} 结构中, 而不是 {{domxref('Headers.entries()', 'entries()')}}: <code>for (var p of myHeaders)</code> 等价于 <code>for (var p of myHeaders.entries())</code>.</p>
<div class="note">
<p><strong>Note</strong>: 您可以通过阅读我们的 <a href="/en-US/docs/Web/HTTP/Headers">HTTP headers</a>参考找到更多关于可用headers的信息。</p>
</div>
<h2 id="构造函数">构造函数</h2>
<dl>
<dt>{{domxref("Headers.Headers()")}}</dt>
<dd>创建一个新的Headers对象.</dd>
</dl>
<h2 id="方法">方法</h2>
<dl>
<dt>{{domxref("Headers.append()")}}</dt>
<dd>给现有的header添加一个值, 或者添加一个未存在的header并赋值.</dd>
<dt>{{domxref("Headers.delete()")}}</dt>
<dd>从Headers对象中删除指定header.</dd>
<dt>{{domxref("Headers.entries()")}}</dt>
<dd>以 {{jsxref("Iteration_protocols","迭代器")}} 的形式返回Headers对象中所有的键值对.</dd>
<dt>{{domxref("Headers.get()")}}</dt>
<dd>以 {{domxref("ByteString")}} 的形式从Headers对象中返回指定header的全部值.</dd>
<dt>{{domxref("Headers.has()")}}</dt>
<dd>以布尔值的形式从Headers对象中返回是否存在指定的header.</dd>
<dt>{{domxref("Headers.keys()")}}</dt>
<dd>以{{jsxref("Iteration_protocols", "迭代器")}}的形式返回Headers对象中所有存在的header名.</dd>
<dt>{{domxref("Headers.set()")}}</dt>
<dd>替换现有的header的值, 或者添加一个未存在的header并赋值.</dd>
<dt>{{domxref("Headers.values()")}}</dt>
<dd>以{{jsxref("Iteration_protocols", "迭代器")}}的形式返回Headers对象中所有存在的header的值.</dd>
</dl>
<div class="note">
<p><strong>Note</strong>: 值得注意的是,在header已存在或者有多个值的状态下{{domxref("Headers.set()")}} 和 {{domxref("Headers.append()")}}的使用有如下区别, {{domxref("Headers.set()")}} 将会用新的值覆盖已存在的值, 但是{{domxref("Headers.append()")}}会将新的值添加到已存在的值的队列末尾. 请参相关词条内的示例代码.</p>
</div>
<div class="note">
<p><strong>Note</strong>:如果您尝试传入名称不是<a href="https://fetch.spec.whatwg.org/#concept-header-name">有效的HTTP头名称</a>的引用，则所有Headers方法都将引发 <code>TypeError</code> 。 如果头部有一个不变的{{Glossary("Guard")}}，则变异操作将会抛出一个 <code>TypeError</code> 。 在其他任何失败的情况下，他们默默地失败。</p>
</div>
<h3 id="Obsolete_methods">Obsolete methods</h3>
<dl>
<dt>{{domxref("Headers.getAll()")}}</dt>
<dd>用于返回具有给定名称的 <code>Headers</code> 对象中所有值的数组; 这个方法现在已经从规范中删除了，{{domxref("Headers.get()")}} 方法现在返回所有的值而不是一个。</dd>
</dl>
<h2 id="示例">示例</h2>
<p>在这个小示例中, 我们将会通过Headers构造函数创建一个新的header, 先使用append()方法添加一个header, 然后通过get()方法返回这个header的值</p>
<pre class="brush: js">let myHeaders = new Headers();
myHeaders.append('Content-Type', 'text/xml');
myHeaders.get('Content-Type');
// should return 'text/xml'
</pre>
<h2 id="规范">规范</h2>
<table class="standard-table">
<tbody>
<tr>
<th scope="col">Specification</th>
<th scope="col">Status</th>
<th scope="col">Comment</th>
</tr>
<tr>
<td>{{SpecName('Fetch','#headers-class','Headers')}}</td>
<td>{{Spec2('Fetch')}}</td>
<td> </td>
</tr>
</tbody>
</table>
<h2 id="浏览器兼容性">浏览器兼容性</h2>
{{Compat("api.Headers")}}
<h2 id="相关链接">相关链接</h2>
<ul>
<li><a href="/en-US/docs/Web/API/ServiceWorker_API">ServiceWorker API</a></li>
<li><a href="/en-US/docs/Web/HTTP/Access_control_CORS">HTTP access control (CORS)</a></li>
<li><a href="/en-US/docs/Web/HTTP">HTTP</a></li>
</ul>
<p> </p>
|
