前言
在现代的 web 应用程序中，前端与后端之间的通讯变得越来越重要。而接口请求是前端与后端的通讯方式之一，也是 web 应用程序中不可或缺的一部分。在前端开发中，我们通常使用 jQuery 或者 axios 等库来发送 Ajax 请求。但是这些库并不能满足所有的需求，对于一些高级的接口请求，我们需要使用一些更加专业的库来完成。
apich-js 是一款封装了 XMLHttpRequest 和 fetch 的 npm 包，支持链式调用，提供了一些常用的请求方法和便利的请求方式，而且它的使用也非常简单。本文将介绍 npm 包 apich-js 的使用方法和一些常用的请求场景。
安装 apich-js
使用 npm 安装 apich-js：
npm install apich-js --save
发送 GET 请求
我们可以使用 apich-js 发送 GET 请求：
import { ajax } from 'apich-js';
ajax.get(url, params, options)
.then(response => console.log(response))
.catch(error => console.error(error));url 是请求的地址，params 是请求的参数，options 是可选参数，包括请求头，超时时间等等。调用 get 方法会返回一个 Promise，通过 then() 方法可以获取返回结果，catch() 方法可以捕获异常。
发送 POST 请求
发送 POST 请求的方法与发送 GET 请求几乎相同，只需要调用 post 方法并传递参数即可：
import { ajax } from 'apich-js';
ajax.post(url, data, options)
.then(response => console.log(response))
.catch(error => console.error(error));data 是请求体中的数据，options 是可选参数。
使用拦截器
apich-js 支持使用拦截器，在请求过程中我们可以添加一些自定义的处理逻辑，例如在请求之前添加请求头，或者在响应之后进行响应数据的处理。可以使用 use 方法注册一个拦截器：
-- -------------------- ---- -------
------ - ---- - ---- -----------
----------
-- ----------
-------------------------- -
-- ---------
------------------------------- - ------- ------------
-- ----
------ -------
--
-- ----------
----------------------------- -
-- -------- ------------
-- ---------------- --- ---- -
----------------------
-
-- ------
------ --------------
-
---
------------- --------发送 FormData 数据
在上传文件的时候通常需要使用 FormData 来进行请求，apich-js 也提供了相应的支持：
-- -------------------- ---- -------
------ - ---- - ---- -----------
----- -------- - --- -----------
------------------------- ------
-------------- --------- -
-------- -
--------------- ---------------------
-
---------------- -- -----------------------常见问题
如何设置请求头？
我们可以在 options 中设置 headers 字段：
-- -------------------- ---- -------
------ - ---- - ---- -----------
----- ------- - -
-------- -
---------------- ------- -----------
-
--
------------- ------- ---------如何设置超时时间？
我们可以在 options 中设置 timeout 字段：
import { ajax } from 'apich-js';
const options = {
timeout: 5000
};
ajax.get(url, params, options);超时时间的单位为毫秒。
如何取消请求？
我们可以使用一个 token 来取消请求，在发送请求的时候传入一个 cancelToken 字段：
-- -------------------- ---- -------
------ - ---- - ---- -----------
----- ------ - --------------------------
------------- -
------------ ------------
---------------- -- -----------------------
-- ----
----------------结语
apich-js 是一款非常实用的请求库，它提供了丰富的请求方式和便利的请求方式，可以帮助我们轻松地完成各种类型的接口请求任务。它的使用也非常简单，只需要了解一些基本的使用方法和常见问题即可。希望本文能对你在前端开发中的工作有所帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005542181e8991b448d175c