当前位置: 代码迷 >> 综合 >> vue axios 登录拦截器
  详细解决方案

vue axios 登录拦截器

热度:73   发布时间:2023-11-19 18:42:33.0

1.安装 vue-cookies

cnpm install vue-cookies --save

2.在登录接口中 设定cookies

 this.$http.post(global.domain + '/login/check',   {username:  this.ruleForm.username,password:  this.ruleForm.password  
})  .then(function (response)  {var dataObj = response.dataconsole.log(dataObj)if(dataObj.code == 200) {that.token = dataObj.data.token;that.$cookies.set('token', that.token, '45d')//--------------------------就是这句 第三个参数是过期时间})  .catch(function (error)  {console.log(error)  
});

3.在main.js中设置拦截器

// 拦截器 每个接口加token
axios.interceptors.request.use(function(config) {if(VueCookies.get('token')) {config.headers.Authorization = String(VueCookies.get('token'))//具体是什么样的头 你和后端对接}return config
}, function(error) {return Promise.reject(error)
})
// 没有就重新登录
axios.interceptors.response.use(function(response) {// console.log(response)// if(response.data.code == 401) {// 	router.replace({// 		name: 'login'// 	});// }return response
}, function(error) {//我的这个是直接走的失败401 status 如果你想走成功的回调就走上边的 具体走哪个还是你们同后端商量统一就好// console.log(error)if (error.response.status==401) {router.replace({name: 'login'})}return Promise.reject(error)   // 返回接口返回的错误信息
})

  相关解决方案