用vue.js做网站,jsp网页模板,百度网页下载,哪个公司的网络最好设计
在src目录下创建一个interceptor.js登录逻辑 设置拦截,在发起请求前,先判断用户是否登录(在本栗中,即是否能够在浏览器缓存中找到token). 登出逻辑 对服务端传过来的数据进行拦截,判断其状态码是否为401(未登录或token过期)清空浏览器缓存中的token重定向到登入页面 inte…设计
在src目录下创建一个interceptor.js登录逻辑 设置拦截,在发起请求前,先判断用户是否登录(在本栗中,即是否能够在浏览器缓存中找到token). 登出逻辑 对服务端传过来的数据进行拦截,判断其状态码是否为401(未登录或token过期)清空浏览器缓存中的token重定向到登入页面 interceptor.js
const axios require(axios);// 参数是Vue实例
export default function(vm) {// 设置请求拦截器axios.interceptors.request.use(config {// 获取tokenconst token localStorage.getItem(token);if (token) { // 如果存在令牌则添加token请求头// config.headers.token token; // 注: 使用Bearer Token规范config.headers.Authorization Bearer ${token};}return config;})// 响应拦截器axios.interceptors.response.use(null, err {if (err.response.status 401) { // 没有登录,或者令牌过期// 清空vuex和localstoragevm.$store.dispatch(logout);// 跳转loginvm.$router.push(/login);}return Promise.reject(err);})
}拦截使用
main.js
import Vue from vue
import ./cube-ui
import App from ./App.vue
import router from ./router
import store from ./store
import interceptor from ./interceptorVue.config.productionTip false// 拦截器的初始化const app new Vue({router,store,render: h h(App)
}).$mount(#app)interceptor(app);