1,配置
1.1,在 plugin
下创立 userAuth
文件
export default (context) => {if(process.client){const token = sessionStorage.getItem('token');
context.app.router.beforeEach((to, from, next) => {if( !token && to.path !== '/login'){next('/login');
}else if(to.path !== '/login'){next();
}else {next();
}
})
}
};
留神
1)路由以后门路和跳转门路不要反复,不然会呈现 死循环,超出堆栈问题。Maximum call stack size exceeded
。
2)莫名其妙呈现的如下报错,然而清理缓存之后就隐没了。[SSE] Connecting to /_loading/sse...
3)process.client
是判断以后是处于服务端,还是客户端。
因为,sessionStorage
是 window 对象,在服务端获取不到。
2,调用
在 nuxt.config.js
中调用
plugins: ['@/plugins/userAuth'],
另外:应用中间件进行路由拦挡
应用中间件会有一个问题,间接如输出指标地址,例如:https://192.1.1.1/home
会胜利进入,只有跳转到别的地址的时候,才会拦挡,跳转登录页。
所以,并不举荐应用
export default function ({route, redirect}) {if (process.client) {const token = sessionStorage.getItem('token');
if (!token && route.path !== '/login') {redirect('/login');
}
}
}
参考:
nuxt 中的 process.static/process.server/process.client