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>
猜您可能还喜欢
评论列表
发表评论
文章分类
文章归档
- 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支付方式总结(5124)
- 2.各大搜索网站网站收录提交入口地址(2581)
- 3.ECharts仪表盘实例及参数使用详解(2467)
- 4.windows 10安装myeclipse 10破解补丁cracker.jar、run.bat闪退解决办法(2343)
- 5.华为鸿蒙系统清除微信浏览器缓存方法(2148)
- 6.HTML5 WebSocket与C#建立Socket连接实现代码(2019)
- 7.HBuilder编辑器格式化代码(1604)
- 8.Js异步async、await关键字详细介绍(lambda表达式中使用async和await关键字)(1355)
- 9. asp.net mvc开发移动端省、市、县三级地区选择控件实现方法(1246)
- 10. C# 使用Socket链接Ftp服务器下载上传代码FTPClient(1234)