需求:不允许token暴漏在地址栏

  • 拿到token放到 sessionStorage里面 并重新刷新地址
  • 所有统一使用query的页面就直接替换为sessionStorage
router.beforeEach((to, from, next) => { 
// ... 其他代码 ... 
// 检查是否有 token 参数
if (to.query.token) { 
// 存储 token 到
sessionStorage sessionStorage.setItem('token', to.query.token);
// 使用 Vue Router 的 replace 方法来更新 URL 
// 这里我们创建一个新的路由对象,删除 token 参数 
const newQuery = { ...to.query };
delete newQuery.token; 
// 删除 token 参数 
router.replace({ ...to, query: newQuery })
.catch(err => {

console.error('Error while navigating:', err); 

}); } // 设置 store 中的 token store.state.login.token = sessionStorage.getItem('token') || ''; 
// ... 其他代码 ... // 调用 
next() 
以继续导航 next(); 
});
posted on 2024-10-16 15:24  awite  阅读(7)  评论(0编辑  收藏  举报