Request 和 Response 都使用了 Fetch API 的 Body 混入,这使得它们能够承载有效载荷。这个混入为两个类型提供了只读的 body 属性(实现为 ReadableStream)、只读的 bodyUsed 布尔值(表示 body 流是否已读),以及一组方法,用于从流中读取内容并将结果转换为某种 JavaScript 对象类型。
通常将 Request 和 Response 的主体作为流来使用主要有两个原因:一是有效载荷的大小可能导致网络延迟,二是流 API 本身在处理有效载荷方面具有优势。此外,最好是一次性获取资源主体。Body 混入提供了 5 个方法,用于将 ReadableStream 转存到缓冲区的内存里,将缓冲区转换为某种 JavaScript 对象类型,并通过 Promise 产生结果。在解决之前,Promise 会等待主体流报告完成及缓冲被解析。这意味着客户端必须等待响应的资源完全加载才能访问其内容。
1. 获取文本内容
Body.text() 方法返回一个 Promise,解析后将缓冲区转存得到的 UTF-8 格式字符串。下面的代码展示了在 Response 对象上使用 Body.text():
fetch("https://foo.com")
.then((response) => response.text())
.then(console.log);
// <!doctype html>
//
//
// …
以下代码展示了在 Request 对象上使用 Body.text():
let request = new Request("https://foo.com", {
method: "POST",
body: "barbazqux"
});
request.text().then(console.log);
// barbazqux
2. 解析 JSON 数据
Body.json() 方法返回一个 Promise,解析后将缓冲区转存得到的 JSON 对象。下面的代码展示了在 Response 对象上使用 Body.json():
fetch("https://foo.com/foo.json")
.then((response) => response.json())
.then(console.log);
// {"foo": "bar"}

