uniapp进行路由拦截时报Maximum call stack size exceeded

UniApp 中路由拦截导致最大调用栈大小超出限制的解决方案
在处理 RangeError: Maximum call stack size exceeded 错误时，通常是因为存在无限循环的路由跳转或未正确终止的递归调用。对于使用 uni-simple-router 组件的情况，可以采取以下措施来解决问题。
1. 防止重复导航到相同路径
当尝试重新导航至当前已激活的路由时，可能会触发不必要的钩子函数执行，进而造成堆栈溢出。可以在 beforeEach 守卫中加入逻辑判断防止这种情况发生：
router.beforeEach((to, from, next) => {
if (from.path === to.path && from.query === to.query) {
return;
}

// 其他业务逻辑...
});
登录后复制
2. 处理未授权用户的重定向
如果用户没有登录，则应被重定向到登录页；但是需要注意的是，一旦到达目标页面（如登录），不应再次触发相同的条件而陷入死循环。可以通过排除特定路径的方式来实现这一点：
const excludePaths = ['/login']; // 添加需要忽略验证的路径列表

if (!uni.getStorageSync('token') && !excludePaths.includes(to.path)) {
console.log('Redirecting to login...');
next({
path: '/login',
replace: true,
params: { redirect: encodeURIComponent(from.fullPath || '/') },
});
} else {
next();
}
登录后复制
这里通过设置 replace: true 参数确保不会留下历史记录，并传递原始请求地址作为参数以便成功认证后能够返回原处[^2]。
3. 使用异步方式获取 Token
有时同步读取存储中的数据可能不够及时，特别是在应用启动初期。考虑采用异步方法加载令牌信息并适当延迟决策过程：
async function checkAuthStatus(to, from, next) {
try {
let token = await getTokenAsync(); // 自定义异步获取Token的方法

if (!token && !excludePaths.includes(to.path)) {
next('/login');
} else {
next();
}

} catch(error){
console.error('Failed to fetch authentication status:', error);
next('/error'); // 或者其他错误处理策略
}
}

// 注册全局前置守卫
router.beforeEach(checkAuthStatus);
登录后复制
以上调整可以帮助避免由于频繁切换状态所引起的性能问题以及潜在的安全隐患[^4]。