对于vue中axios拦截器简单封装
axios.interceptors.response.use(
response => {
// 如果返回的状态码为200,说明接口请求成功,可以正常拿到数据
// 否则的话抛出错误
if (response.status === 200) {
if (response.headers.x_auth_token) {
localStorage.setItem('x_auth_token', response.headers.x_auth_token); // 存储token
}
} else {
return Promise.reject(response);
}
},
error => {
if (error.response.status) {
switch (error.response.status) {
// 401: 未登录
case 401:
break;
// 403: token过期
case 403:
break;
// 404:请求不存在
case 404:
break;
default:
alert(error.response.data.message);
}
return Promise.reject(error.response);
}
}) axios 请求拦截器
axios.interceptors.request.use(
config => {
// 每次发送请求之前判断vuex中是否存在tocken
// 如果存在,则统一在http请求的header都加上tocken,这样后台根据tocken判断你的登录情况
// 即使本地存在token,也有可能token是过期的,所以在响应拦截器中要对返回状态进行判断
const token = localStorage.getItem('x_auth_token');
token && (config.headers.x_auth_token = token);
return config;
},
error => {
return Promise.error(error);
}
)
对于vue中axios拦截器简单封装的更多相关文章
- vue axios拦截器的封装
// request.js import axios from 'axios' import qs from 'qs' // 创建axios实例 const service = axios.creat ...
- vue中axios的使用与封装
分享下我自己的axios封装axios是个很好用的插件,都是一些params对象,所以很方便做一些统一处理 当然首先是npm安装axios 很简单$ npm install axios --save在 ...
- vue中axios的二次封装
我们做项目时,虽然axios也可以直接拿来用,但是对接口比较零散,不太好进行维护,也会产生大量的重复代码,所以我在这对axios进行了统一接口处理 第一步,先在src中的公共文件夹中如utils里新建 ...
- Vue2学习小记-给Vue2路由导航钩子和axios拦截器做个封装
1.写在前面 最近在学习Vue2,遇到有些页面请求数据需要用户登录权限.服务器响应不符预期的问题,但是总不能每个页面都做单独处理吧,于是想到axios提供了拦截器这个好东西,再于是就出现了本文. 2. ...
- vue axios拦截器 + 自编写插件 实现全局 loading 效果;
项目需求:用自定义的 .gif 图标实现全局 loading 效果:为避免在每个页面手动添加,且简单高效的实现,经查阅资料,最终采用了 vue axios拦截器 + 自编写 loading 插件:下面 ...
- 聊聊 Vue 中 axios 的封装
聊聊 Vue 中 axios 的封装 axios 是 Vue 官方推荐的一个 HTTP 库,用 axios 官方简介来介绍它,就是: Axios 是一个基于 promise 的 HTTP 库,可以用在 ...
- Vue中axios的封装和api接口的统一管理
更新的是我csdn上的文章,需要的话可以看下,互相学习点击去我的csdn vue中axios的封装 在vue项目和后端交互获取数据时,通常使用axios库,官方文档:https://www.npmjs ...
- vue --- axios拦截器+form格式请求体
在vue2.x中使用CLI生成的模板有很大改变,需要自己手动在main.ts同级目录下新建interceptors.ts interceptors.ts import axios from 'axio ...
- Vue基于vuex、axios拦截器实现loading效果及axios的安装配置
准备 利用vue-cli脚手架创建项目 进入项目安装vuex.axios(npm install vuex,npm install axios) axios配置 项目中安装axios模块(npm in ...
随机推荐
- windows下安装node【转】
windows下安装node报错2503.2502 windows下命令行安装,首先使用管理员权限获取cmd msiexec /package node-v10.16.0-x64.msi 根据提示一步 ...
- linux记录-安装elk记录(参考博文)
什么是ELK? 通俗来讲,ELK是由Elasticsearch.Logstash.Kibana .filebeat三个开源软件的组成的一个组合体,这三个软件当中,每个软件用于完成不同的功能,ELK 又 ...
- Linux的桌面虚拟化技术KVM(五)——virsh常用命令
Linux的桌面虚拟化技术KVM(一)——新建KVM虚拟机 Linux的桌面虚拟化技术KVM(二)——远程桌面管理 Linux的桌面虚拟化技术KVM(三)——KVM虚拟机克隆和快照 Linux的桌面虚 ...
- LeetCode_345. Reverse Vowels of a String
345. Reverse Vowels of a String Easy Write a function that takes a string as input and reverse only ...
- Win10利用CodeBlocks搭建Objective-C开发环境(一)
为了学习ios开发,而手头没有苹果机,若在windows平台下学习objective-c编程.则需要安装OC开发环境, 经过在网上查阅各种相关资料,历经多次失败,终于安装并测试成功,特将安装过程和经验 ...
- Linux中执行 .sh 的方法
linux下执行.sh文件的方法 .sh文件就是文本文件,如果要执行,需要使用chmod a+x xxx.sh来给可执行权限. 是bash脚本么 可以用touch test.sh #创建test.sh ...
- virtualenv虚拟环境搭建及pipreqs自动生成第三方模块简介
阅读目录 virtualenv简介 含义: 为何要用虚拟环境: virtualenv安装和使用 pipreqs模块的介绍和使用 回到顶部 virtualenv简介 回到顶部 含义: virtual:虚 ...
- python scipy包进行GO富集分析p值计算
最近总是有需要单独对某一个类型的通路进行超几何分布的p值计算,这里记录一下python包的计算方法 使用scipy的stat里面的hypergeom.sf方法进行富集分析的p值计算 hsaxxxxx ...
- git下载仓库的部分目录
有这样的需求,比如某个仓库里包含可执行文件[编译后的文件]或jar包之类的,他们太大我不需要而且我自己可以编译或导入: 或者是某个仓库是自己专门用来放demos的,里面有很多的demo项目,我可能只想 ...
- Java常用命令:jps、jstack、jmap、jstat(带有实例教程)
版权声明:本文为博主原创文章,未经博主允许不得转载. https://blog.csdn.net/u013310517/article/details/80990924 查看Java进程:jps ...