currently, only the login page does not require token verification, and all other pages need to be logged in before you can enter (token is valid). The header requested by api contains token information, and the token is stored in cookies after a successful login. All jumps except Login are judged by requireAuth.
when you do not log in, click URL in the history to go directly to the page inside.
take the local tomcat environment as an example: the url of http://172.21.81.206:8085/storemonitor_ui is directly entered and cannot be blocked. If it is the url below, you cannot enter it without logging in. Path:"/event"
http://172.21.81.206:8085/storemonitor_ui/-sharp/login?redirect=%2Fevent
//main.js
import {getToken} from "@/common/auth"
router.beforeEach((to,from,next)=>{
if(to.meta.requireAuth){ //
if(getToken()){ //vuex state token
next();
}
else{
next({
path:"/login",
query:{redirect:to.fullPath}
})
}
}
else{
next();
}
})
//router
export default new Router({
routes: [
{
path:"/login",
name:"Login",
component:Login,
meta:{
requireAuth: false,
}
},
{
path: "/",
name: "",
redirect:"/event",
component: Home,
iconCls:"iconfont icon-zonglan",
leaf:true, //
children:[
{
path:"allscan",
name:"",
component:resolve=>require(["@/views/allscan/AllScan"],resolve),
meta:{
requireAuth: true,
}
}
]
},
{
path: "/",
name:"",
component:Home,
iconCls:"iconfont icon-shijian",
leaf:true,
children:[
{
path:"/event",
name:"",
component:resolve=>require(["@/views/event/EventManage"],resolve),
meta:{
keepAlive:true, //the component is"t to be cache.
requireAuth: true,
}
},
{
path:"/event",
name:"",
component:resolve=>require(["@/views/event/details/RateManage"],resolve),
meta:{
requireAuth: true,
},
children:[
{
path:"/rate",
name:"",
component:resolve=>require(["@/views/event/details/RateManage"],resolve),
}
]
},
]
}
])
//store
const state={
token:getToken();
},
actions:{
LoginByUser({commit},userInfo){
const username=userInfo.username.trim();
let params={
"email":username,
"password":userInfo.password
}
return new Promise((resolve,reject)=>{
loginByUsername(params).then(res=>{
console.log(res);
const data=res.data;
commit("SET_TOKEN",data.token);
setToken(data.token);
resolve(data);
}).catch(error=>{
reject(error);
})
})
}
}
//Login
self.$store.dispatch("LoginByUser",this.loginForm).then((res)=>{
self.$router.push({path:self.redirect||"/"});
}).catch(()=>{
Message({message:"",type:"error",duration:3*1000})
})