在前端开发中，经常需要进行网络请求。为了方便地发起网络请求并对返回结果进行处理，我们可以使用一些开源的 npm 包。其中，exp-req 就是一个很好用的 npm 包。本篇文章将介绍 exp-req 的使用方法，并提供一些示例代码，帮助你更好地使用它。
exp-req 是什么？
exp-req 是一个基于 axios 封装的 npm 包。它可以帮助我们轻松地发起网络请求，并对返回结果进行处理。exp-req 主要包含以下功能：
- 支持 Promise 链式调用；
- 支持 GET、POST、PUT、DELETE 等常见 HTTP 方法；
- 支持请求头和响应头的设置；
- 支持请求错误和响应错误的全局处理。
exp-req 的安装
使用 npm 可以很方便地安装 exp-req。打开终端，进入你的项目目录，然后执行以下命令即可：
npm install exp-req --save
exp-req 的使用
接下来，让我们来看看 exp-req 的使用方法。首先，我们需要在项目中引入 exp-req 模块：
import expReq from "exp-req";
然后，我们就可以使用 expReq 对象发起网络请求了。例如，我们要发起一个 GET 请求，请求路径为 /api/user，代码如下：
expReq.get("/api/user").then((response) => {
console.log(response.data);
});上面的代码中，expReq.get 方法会返回一个 Promise 对象。当请求成功后，Promise 对象的 then 方法会被调用，并将服务器返回的数据作为参数传递给它。在上面的代码中，我们将服务器返回的数据打印出来。
我们也可以使用 POST 方法发起一个带有数据的请求：
expReq.post("/api/user", { name: "John", age: 18 }).then((response) => {
console.log(response.data);
});在上面的代码中，我们将一个包含 name 和 age 字段的 json 对象作为参数传递给了 expReq.post 方法。服务器将收到这个 json 对象，并返回处理后的结果。
除了这些常见的 HTTP 方法外，exp-req 还提供了一些其他的方法，例如 PUT、DELETE 和 HEAD 等。它们的使用方式都类似，我们只需要将方法名改成相应的大写字母即可。
exp-req 的更多功能
除了上面提到的基本使用，exp-req 还提供了一些其他的功能，例如设置请求头和响应头、全局错误处理等。
设置请求头和响应头
我们可以通过传递一个 headers 字段来设置请求头和响应头。例如，我们要设置一个自定义的请求头：
expReq.post("/api/user", { name: "John" }, { headers: { "X-Requested-With": "XMLHttpRequest" } }).then((response) => {
console.log(response.data);
});上面的代码中，我们在请求中添加了一个 X-Requested-With 字段，并将它的值设为 XMLHttpRequest。当服务器收到这个请求时，就可以根据这个字段判断是否为 AJAX 请求。
全局错误处理
exp-req 还提供了一个全局错误处理函数，我们可以在这个函数中处理所有的请求错误和响应错误。例如，如果服务器返回了一个 404 状态码，我们就可以在这个函数中处理这种情况：
-- -------------------- ---- -------
---------------------- -- -
-- ----------- --- ---- -
---------------- --- --------
- ---- -
---------------------------
-
---
------------------------------------------ -- -
---------------------------
---------------- -- -
-------------------
---在上面的代码中，我们定义了一个全局错误处理函数 expReq.onError。当请求发生错误时，这个函数会被调用，并将错误对象作为参数传递给它。我们可以根据错误对象的 code 字段来判断错误类型，然后进行相应的处理。
总结
本文介绍了 npm 包 exp-req 的基本使用方法，并提供了一些示例代码。通过学习本文，我们可以更好地使用 exp-req 来发起网络请求，并对返回结果进行处理。在实际的开发中，我们可以根据 exp-req 提供的 API，来进行更加灵活和丰富的开发。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60056bfe81e8991b448e5b1c