vue 上次登录时间_Vue设置长时间未操作登录自动到期返回登录页

vue设置长时间未操作登录以后自动到期返回登录页

首先我们写在main.js文件中

import routerutil from "@/utils/routerutil";//先将js文件在main.js中引入

routerutil(router);

我们会在登陆成功后调用sessionutil文件中的setsession，sessionutil下面写的有

import sessionutil from '@/utils/sessionutil'

sessionutil.setsession("userinfo", '2');

在routerutil.js文件中

import sessionutil from "./sessionutil";

const whitelist = ["/",'/logins']; // 路由白名单，不需要校验

export default router => {

router.beforeeach(async (to, from, next) => {/*在跳转之前执行*/

const userinfo = sessionutil.getsession("userinfo");//触发sessionutil中的getsession方法

if ( userinfo ) {

} else {

if (whitelist.indexof(to.path) !== -1) {

next();

} else {

message({

type: "warning",

message: "用户登录过期，请重新登录",

duration: 1500,

onclose() {

next(`/`);

}

});

}

}

});

};

在sessionutil.js文件中

const sessionutil = {

setsession(key,value,maxage){ //key=userinfo value=2 maxage='' || 可自行设置

const maxagetime = new date().gettime() + 1000 * 3600; // 当前时间的+1小时 session 过期时间

try{

let data = { value, maxage: maxage ? maxage : maxagetime }

sessionstorage.setitem(typeof key === 'string'?key: json.stringify(key),json.stringify(data))

}catch(err){

}

},

getsession(key){

try{

const maxagetime = new date().gettime() + 1000 * 3600; // 首先先设置一个 session 过期时间 1h后可自行设置

let date = new date().gettime(); //当前时间

let session = json.parse(sessionstorage.getitem(typeof key === 'string'?key: json.stringify(key)));

if(session && session.maxage != null && session.maxage-date > 0 && session.maxage <= maxagetime ){

this.setsession(key,session.value);

return session.value;

} else {

return null;

}

}catch(err){

}

},

}

export default sessionutil;

总结

以上所述是小编给大家介绍的vue设置长时间未操作登录自动到期返回登录页，希望对大家有所帮助！

如您对本文有疑问或者有任何想说的，请点击进行留言回复，万千网友为您解惑！