axios的简单的使用方法

Axios 是一个属于promise 的网络请求库，作用于node.js 和浏览器中。 在服务端它使用原生 node.js http模块, 而在客户端则使用 XMLHttpRequests，下面我们来看下axios的简单的使用方法

配置请求拦截器
在请求拦截时可以做常规配置，如请求头添加token共有数据等

_axios.interceptors.request.use(config=>{// 添加token
 config.headers.token ='token';// do something},error=>Promise.reject(error))

配置返回拦截器

_axios.interceptors.response.use(config=>{// do something},error=>{// 做统一的错误处理// 401 需授权// 404 接口不存在// 等等})

取消重复请求
在实用中需要一个按钮多次快速点击，这样就会在很短时间内完成多次请求
在此我们会用到 axios.CancelToken 这个方法

封装取消请求的方法

classCancelToken{constructor(){this.store =newMap();}add(config){const key =this.getKey(config);newaxios.CancelToken((cancel)=>{if(this.store.has(key)){this.remove(config)}this.store.set(key, cancel);});}remove(config){const key =this.getKey(config);if(this.store.has(key)){let cancel =this.store.get(key);cancel(key);this.store.delete(key);}}// 获取唯一的keygetKey(config){const{ method, url, params, data }= config;return[method, url, params, data].join('-');}}

使用CancelToken方法

const cancelToken =newCancelToken();// 请求拦截器
axios.interceptors.request.use(config=>{
    cancelToken.add(config);},error=>Promise.reject(error))// 接收拦截器
axios.interceptors.response.use(response=>{const config = response.config;
        cancelToken.remove(config)
        Promise.resolve(response)},error=>{return Promise.reject(error);});

以上就是关于“axios的简单的使用方法”的相关解答如需购买测试PHP主机，推荐酷番云共享虚拟主机、独享IP虚拟主机齐备，各类配置均有，满足不同网站建设需求；另外提供免费虚拟主机，可供测试，让您快速上线网站。

选购地址：https://www.kufanyun.com/host/