本地存储必须要有token才能进入某个页面（比如购物车页面），否则会被拦截。
请求服务器数据的request.js部分代码：
// 请求拦截(interceptors: 中文为拦截器)
instance.interceptors.request.use(config=>{
let token=localStorage.getItem('token')
if(token){
config.headers.token=token; //请求头名称由接口文档提供
}
return config;
}, err=>{
return Promise.reject(err)
})
// 响应拦截
instance.interceptors.response.use(res=>{
return res.data;
}, err=>{
return Promise.reject(err)
})
路由js部分代码
//路由拦截
router.beforeEach((to, from, next) => {
//去购物车页面必须有token
let token = localStorage.getItem("token");
if (to.path == "/cart") { //跳转到购物车页面
if (token) {
next();
} else {
Vue.prototype.$toast("请先登录");//$toast是vantui框架里的组件
setTimeout(() => {
next("/user"); //下一个页面是用户登录页面
}, 2000);
}
return;
}
//这个next适配所有路由
next();
});
