Headers 并不是与Map 处处都一样。在初始化Headers 对象时,也可以使用键/值对形式的对象,
而Map 则不可以:
let seed = {foo: ‘bar’};
let h = new Headers(seed);
console.log(h.get(‘foo’)); // bar
let m = new Map(seed);
// TypeError: object is not iterable
一个HTTP 头部字段可以有多个值,而Headers 对象通过append()方法支持添加多个值。在
Headers 实例中还不存在的头部上调用append()方法相当于调用set()。后续调用会以逗号为分隔符
拼接多个值:
let h = new Headers();
h.append(‘foo’, ‘bar’);
console.log(h.get(‘foo’)); // “bar”
h.append(‘foo’, ‘baz’);
console.log(h.get(‘foo’)); // “bar, baz”
3. 头部护卫
某些情况下,并非所有HTTP 头部都可以被客户端修改,而Headers 对象使用护卫来防止不被允
许的修改。不同的护卫设置会改变set()、append()和delete()的行为。违反护卫限制会抛出
TypeError。
Headers 实例会因来源不同而展现不同的行为,它们的行为由护卫来控制。JavaScript 可以决定
Headers 实例的护卫设置。下表列出了不同的护卫设置和每种设置对应的行为。
护 卫 适用情形 限 制
none 在通过构造函数创建Headers 实例时激活 无
request 在通过构造函数初始化Request 对象,且mode
值为非no-cors 时激活
不允许修改禁止修改的头部(参见MDN 文档中
的forbidden header name 词条)
request-no-cors 在通过构造函数初始化Request 对象,且mode
值为no-cors 时激活
不允许修改非简单头部(参见MDN 文档中的
simple header 词条)
response 在通过构造函数初始化Response 对象时激活不允许修改禁止修改的响应头部(参见MDN 文
档中的forbidden response header name 词条)
immutable 在通过error()或redirect()静态方法初始
化Response 对象时激活
Request 对象
顾名思义,Request 对象是获取资源请求的接口。这个接口暴露了请求的相关信息,也暴露了使
用请求体的不同方式。
创建Request 对象
可以通过构造函数初始化Request 对象。为此需要传入一个input 参数,一般是URL:
let r = new Request(‘https://foo.com’);
console.log®;
// Request {…}
Request 构造函数也接收第二个参数——一个init 对象。这个init 对象与前面介绍的fetch()
的init 对象一样。没有在init 对象中涉及的值则会使用默认值:
// 用所有默认值创建Request 对象
console.log(new Request(‘’));
// Request {
// bodyUsed: false
// cache: “default”
// credentials: “same-origin”
// destination: “”
// headers: Headers {}
// integrity: “”
// keepalive: false
// method: “GET”
// mode: “cors”
// redirect: “follow”
// referrer: “about:client”
// referrerPolicy: “”
// signal: AbortSignal {aborted: false, onabort: null}
// url: “”
// }
// 用指定的初始值创建Request 对象
console.log(new Request(‘https://foo.com’,
{ method: ‘POST’ }));
// Request {
// bodyUsed: false
// cache: “default”
// credentials: “same-origin”
// destination: “”
// headers: Headers {}
// integrity: “”
// keepalive: false
// method: “POST”
// mode: “cors”
// redirect: “follow”
// referrer: “about:client”
// referrerPolicy: “”
// signal: AbortSignal {aborted: false, onabort: null}
// url: “https://foo.com/”
// }
08-10
419
![](https://csdnimg.cn/release/blogv2/dist/pc/img/readCountWhite.png)