基于vue实现token验证的实例代码-创新互联
vue-koa2-token
创新互联建站主要从事成都网站设计、做网站、网页设计、企业做网站、公司建网站等业务。立足成都服务福建,10年网站建设经验,价格优惠、服务专业,欢迎来电咨询建站服务:18982081108基于vue的 做了token验证
前端部分(对axios设置Authorization)
import axios from 'axios' import store from '../store' import router from '../router' //设置全局axios默认值 axios.defaults.timeout = 6000; //6000的超时验证 axios.defaults.headers.post['Content-Type'] = 'application/json;charset=UTF-8'; //创建一个axios实例 const instance = axios.create(); instance.defaults.headers.post['Content-Type'] = 'application/json;charset=UTF-8'; axios.interceptors.request.use = instance.interceptors.request.use; //request拦截器 instance.interceptors.request.use( config => { //每次发送请求之前检测都vuex存有token,那么都要放在请求头发送给服务器 if(store.state.token){ config.headers.Authorization = `token ${store.state.token}`; } return config; }, err => { return Promise.reject(err); } ); //respone拦截器 instance.interceptors.response.use( response => { return response; }, error => { //默认除了2XX之外的都是错误的,就会走这里 if(error.response){ switch(error.response.status){ case 401: store.dispatch('UserLogout'); //可能是token过期,清除它 router.replace({ //跳转到登录页面 path: 'login', query: { redirect: router.currentRoute.fullPath } // 将跳转的路由path作为参数,登录成功后跳转到该路由 }); } } return Promise.reject(error.response); } ); export default instance;
另外有需要云服务器可以了解下创新互联scvps.cn,海内外云服务器15元起步,三天无理由+7*72小时售后在线,公司持有idc许可证,提供“云服务器、裸金属服务器、高防服务器、香港服务器、美国服务器、虚拟主机、免备案服务器”等云主机租用服务以及企业上云的综合解决方案,具有“安全稳定、简单易用、服务可用性高、性价比高”等特点与优势,专为企业上云打造定制,能够满足用户丰富、多元化的应用场景需求。
当前文章:基于vue实现token验证的实例代码-创新互联
地址分享:http://scyanting.com/article/coccjs.html