Response: json() 方法
注意:此功能在 Web Workers 中可用。
Response 接口的 json() 方法会读取一个 Response 流并将其读取完毕。它会返回一个 Promise,该 Promise 会解析为将响应体文本解析为 JSON 后的结果。
请注意,尽管该方法名为 json(),但其结果并不是 JSON,而是将 JSON 作为输入并将其解析以生成 JavaScript 对象的结果。
语法
js
json()
参数
无。
返回值
一个 Promise,它解析为一个 JavaScript 对象。该对象可以是任何可以用 JSON 表示的内容 — 对象、数组、字符串、数字……
异常
AbortErrorDOMException-
请求已被 中止。
TypeError-
因以下原因之一而抛出:
- 响应体已被 干扰或锁定。
- 解码正文内容时出错(例如,因为
Content-Encoding标头不正确)。
SyntaxError-
无法将响应体解析为 JSON。
示例
在我们 fetch JSON 示例(运行 fetch JSON 实时演示)中,我们使用 Request() 构造函数创建了一个新请求,然后使用它来获取一个 .json 文件。当 fetch 成功时,我们使用 json() 读取和解析数据,然后像预期的那样从结果对象中读取值,并将它们插入列表项以显示我们的产品数据。
js
const myList = document.querySelector("ul");
const myRequest = new Request("products.json");
fetch(myRequest)
.then((response) => response.json())
.then((data) => {
for (const product of data.products) {
const listItem = document.createElement("li");
listItem.appendChild(document.createElement("strong")).textContent =
product.Name;
listItem.append(` can be found in ${product.Location}. Cost: `);
listItem.appendChild(document.createElement("strong")).textContent =
`£${product.Price}`;
myList.appendChild(listItem);
}
})
.catch(console.error);
规范
| 规范 |
|---|
| Fetch # ref-for-dom-body-json① |
浏览器兼容性
加载中…