跳到主要内容

Request 与 Response

Request 对象如何创建与描述请求?​

const r2 = new Request("https://foo.com", { method: "POST" });
属性含义
method请求方法
url请求 URL
headers请求头
body请求体
mode请求模式
credentials凭证配置
cache缓存策略

Request 与 Response 如何克隆?​

  • new Request(r) / new Response(res): 克隆后原对象的请求体被标记为已使用;
  • r.clone() / res.clone(): 原对象不受影响;
  • 一次性: Request 与 Response 的 body 只能被消费一次, 用过后不能再克隆或读取;
const r = new Response("foobar", { status: 418, statusText: "I'm a teapot" });

Body 混入提供哪些读取方法?​

  • 共性: Request 与 Response 都混入 Body, 拥有只读的 body 与 bodyUsed;
  • 转换: 先读取 ReadableStream 到缓冲区, 再按类型解析;
方法返回类型
text()Promise<string>
json()Promise<any>
blob()Promise<Blob>
arrayBuffer()Promise<ArrayBuffer>
formData()Promise<FormData>
const res = await fetch("/api");
const data = await res.json(); // 之后 res.bodyUsed 为 true
  • 一次性流: 所有读取方法只能调用一次;

fetch 的选项与 Request 属性如何对应?​

  • 关系: fetch(input, init) 中描述出站请求的字段, 与 Request 的属性同名同义;
  • 上表未列出的选项与默认值:
选项默认值含义摘要
referrer"about:client"指定或清空 Referer
referrerPolicy"strict-origin-when-cross-origin"Referer 发送规则
redirect"follow"重定向处理方式
integrity""响应校验和
keepalivefalse请求可活过页面卸载
signalundefinedAbortController 的中断信号

Response 的状态信息由什么构成?​

  • 构造: new Response(body, init), init 可指定 status、statusText、headers; 省略 status 时为 200;
  • status: HTTP 状态码, 如 200 / 404 / 418;
  • ok: 派生值, status 落在 200-299 时为 true, 不是可写字段;
  • headers: Map 式响应头集合, 用 get() 取值, 可 for...of 遍历;