简介
whatwg-fetch 是一个可用于浏览器和 Node.js 的基于 Promise 的 Fetch API 实现。它提供了一种简单、统一的接口，用于在 Web 应用程序中进行 HTTP 请求。fetch 不仅可以跨域请求数据，而且还支持流式数据。本文将详细介绍如何使用此 npm 包。
安装
通过 npm 安装 whatwg-fetch：
npm install whatwg-fetch --save
如果你正在使用 Node.js 或 Webpack，那么你可以直接引用它：
const fetch = require('whatwg-fetch');如果你正在使用 ES6 模块，则可以像下面这样导入它：
import fetch from 'whatwg-fetch';
使用
whatwg-fetch API 与标准 Fetch API 几乎相同。下面是基本的 GET 请求示例：
fetch('https://example.com/data.json')
.then(response => response.json())
.then(data => console.log(data))
.catch(error => console.error(error));为了执行一个 POST 请求，我们需要定义一个对象来存储请求参数，并将其传递给 fetch 方法：
-- -------------------- ---- -------
----- ----------- - -
------- -------
-------- -
--------------- ------------------
--
----- ----------------
----- ----- -----
------ ---------------------
--
--
----------------------------------- ------------
-------------- -- ----------------
---------- -- ------------------
------------ -- ----------------------深入
请求选项
fetch 方法接受两个参数：URL 和一个可选的对象，该对象包含请求选项。以下是常见的选项：
method: 请求方法（GET、POST、PUT 等）；headers: 包含请求头信息的对象；body: 请求体内容；mode: 控制跨域请求的行为；cache: 控制缓存的行为；credentials: 控制是否允许发送跨域 cookies；redirect: 控制重定向的行为。
例如，我们可以使用下面这个请求选项对象来指定自定义请求头和跨域请求的模式：
-- -------------------- ---- -------
----- -------------- - -
------- ------
-------- -
------------------ -------
--
----- ------
--
-------------------------------------- ---------------
-------------- -- ----------------
---------- -- ------------------
------------ -- ----------------------响应处理
fetch 返回一个 Promise 对象，它在响应成功时解析为 Response 对象，并在失败时抛出错误。我们可以使用 then 和 catch 方法来处理响应结果和错误：
-- -------------------- ---- -------
--------------------------------------
-------------- -- -
-- ------------- -
------ ----------------
- ---- -
----- --- -------------- -------- --- --- -----
-
--
---------- -- ------------------
------------ -- ----------------------请注意，response.ok 是一个布尔值，表示响应状态是否在 200-299 范围内。
错误处理
如果请求失败（例如网络错误、无法解析 JSON 响应等），则 catch 方法将被调用。可以使用以下代码来捕获和处理这些错误：
-- -------------------- ---- -------
--------------------------------------
-------------- -- -
-- ------------- -
------ ----------------
- ---- -
----- --- -------------- -------- --- --- -----
-
--
---------- -- ------------------
------------ -- ----------------------结论
whatwg-fetch 是一个简单、易用且功能强大的 npm 包，可用于在浏览器和 Node.js 中进行 HTTP 请求。本文介绍了其基本用法、高级选项和错误处理方法，希望对你有所帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/42571