axios入门(5)—— 拦截器介绍
一、简介
拦截器的意思是在请求之前或响应被处理前拦截他们,比如在请求后台接口前可以增加“加载提示”效果。拦截器包括请求拦截器和响应拦截器。
代码如下:
<script> import axios from 'axios' export default{ name:'拦截器', created(){ //1、请求拦截器 axios.interceptors.Request.use(config=>{ //发起请求前执行代码 return config; },err=>{ //请求错误执行代码 return Promise.reject(err); }); //2、响应拦截器 axios.interceptors.Response.use(res=>{ //请求成功并返回响应数据执行代码 return res; },err=>{ //请求错误执行代码 return Promise.reject(err); }); //3、取消拦截器 let interceptors = axios.interceptors.required.use( config=>{ config.headers={ auth:true } return config; }) axios.interceptors.Request.eject(interceptors) } } </script>
二、实例代码
后台开发中,每次调用接口都需要身份验证,可以给接口传入token,下面代码每次通过instance实例调用接口都会提交token到后台接口。
<script> import axios from 'axios' export default{ name:'拦截器', created(){ let instance = axios.create({}); instance.interceptors.Request.use( config=>{ config.headers.token = 'token' } return config; ); //使用instance调用接口之前都会传入token值 instance.get('接口地址').then(res=>{ //成功执行代码 }) } } </script>
猜您可能还喜欢
评论列表
发表评论
文章分类
文章归档
- 2025年3月 (1)
- 2024年6月 (2)
- 2024年5月 (2)
- 2024年4月 (4)
- 2024年3月 (30)
- 2024年1月 (4)
- 2023年12月 (2)
- 2023年11月 (4)
- 2023年10月 (4)
- 2023年9月 (6)
- 2023年3月 (2)
- 2023年2月 (1)
- 2023年1月 (1)
- 2022年12月 (1)
- 2022年9月 (21)
- 2022年8月 (10)
- 2022年7月 (3)
- 2022年4月 (1)
- 2022年3月 (13)
- 2021年8月 (1)
- 2021年3月 (1)
- 2020年12月 (42)
- 2020年11月 (7)
- 2020年10月 (5)
- 2020年8月 (1)
- 2020年6月 (1)
- 2020年3月 (2)
- 2019年12月 (8)
- 2019年11月 (3)
- 2019年9月 (1)
- 2019年4月 (1)
- 2019年3月 (6)
- 2019年2月 (1)
- 2018年7月 (7)
阅读排行
- 1.asp.net mvc内微信pc端、H5、JsApi支付方式总结(5702)
- 2.各大搜索网站网站收录提交入口地址(3201)
- 3.Windows 10休眠文件更改存储位置(3164)
- 4.ECharts仪表盘实例及参数使用详解(3095)
- 5.windows 10安装myeclipse 10破解补丁cracker.jar、run.bat闪退解决办法(2992)
- 6.HTML5 WebSocket与C#建立Socket连接实现代码(2866)
- 7.华为鸿蒙系统清除微信浏览器缓存方法(2784)
- 8.CERT_HAS_EXPIRED错误如何解决(2249)
- 9.Js异步async、await关键字详细介绍(lambda表达式中使用async和await关键字)(2189)
- 10.HBuilder编辑器格式化代码(2118)