硅谷甄选-axios的二次封装

axios是插件；

axios的二次封装

• 目的是使用请求拦截器和响应拦截器；
  • 进度条
  • token
• 响应拦截器
  • 简化数据
  • 处理网络错误

安装axios

pnpm install axios

创建utils文件夹

创建request.ts

先导入axios

用create创建axios，这样我们可以写配置；

我们写配置的时候，可以使用开发环境当中的变量；

这是第一步，我们创建axios实例，写了一些配置，通过读取我们的环境变阿玲，然后设置了超时时间；

config对象有一个headers属性，这个属性经常给服务器端，携带公共的参数；

1、服务器响应的数据是一个对象，我们要使用的一般是data，我们可以在响应拦截器中简化响应数据。

2、响应拦截器可以处理http网络错误；

到这里我们的请求和响应拦截器就封装完成了；

这样我们就可以对外暴露，使用了；

---

现在需要测试一下；

上面的就是测试代码；

上面就是测试的效果；

优化

引导一：我们看看请求拦截器的config对象是什么东西；

引导二：config对象当中有headers

headers能够给服务器带参数；

引导三：

• 你的项目当中要发送10000次请求；
• 你就会使用10000次config，通过config.header携带公共的参数；

引导四：response返回的样式，就是上面的玩意；

镇楼 - 萨布丽娜·克劳迪奥 - 跛脚滨

Sabrina Claudio

萨布丽娜·克劳迪奥

“Sabrina”是一个源自拉丁语的名词，意思是“位于河流旁的”，取滨

Claudio是一个男性化的名字，源自拉丁语，其含义与“跛脚”有关。