作为一名前端开发者，我们每天都在面对请求后端接口的情况，同时互联网上也提供了很多请求库，而其中 yyl-request 就是一个十分常用的 npm 包。它是 yyl 工具链专门为前端请求接口而设计的，同时特别强调了错误处理和基于 axios 的出色性能。本文将会介绍 yyl-request 的安装、使用、错误处理等，让你快速上手。
安装
使用 npm 安装 yyl-request，如果已全局安装则更加方便：
npm install yyl-request
使用
在引入库之前，为了优化使用体验，我们建议在程序最开始给全局设置一个 yyl=request, 或可设置其它默认值，从而减少使用时的代码量。
基本用法
yyl-request 的基本用法十分简单：
-- -------------------- ---- -------
-------------
---- --------------
------- -------
-------- -
--------------- --------------------------------
--
----- -
----- ------
-
--请求拦截器
yyl-request 提供了请求拦截器，可以在请求发送之前对请求进行操作。例如统一添加 token 等：
yyl.request.interceptors.request.use((config) => {
// config 参数包含请求信息
config.headers.token = localStorage.getItem('token')
return config
})响应拦截器
yyl-request 同时支持响应拦截器，在响应返回后对返回结果进行操作：
yyl.request.interceptors.response.use((response) => {
// response 参数包含响应信息
if (response.data.status === 'error') {
// 错误处理
}
return response
})错误处理
yyl-request 有一个非常出色的错误处理机制。如果请求出错，会自动触发错误拦截器。可以像下面这样定义错误拦截器：
yyl.request.interceptors.response.use(null, (error) => {
if (error.response.status === 401) {
// 处理认证失败的错误
} else if (error.response.status === 500) {
// 处理服务器错误
}
return Promise.reject(error)
})配置默认值
为了安全快捷的获取数据，yyl-request 提供了配置默认值的功能，当然默认值也将被拦截器改变。例如每个请求都需要带上 token：
yyl.request.defaults.headers.common.token = localStorage.getItem('token')总结
yyl-request 提供了非常优秀的请求处理机制，即使是新手也很快可以上手。同时通过一些默认值和拦截器的设置，能够让它更好的服务于开发。赶快尝试使用起来吧，相信会对你的开发工作有所帮助。
完整的示例代码请查看 yyl-request 使用示例。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/5eedc20ab5cbfe1ea0611ff7