zlwu
afe3e234e9
✨ 新增功能: - 全局路由守卫模块 (route-guard.js) - 多层次权限验证 (登录状态+Token存在+Token过期检查) - 自动拦截机制 (页面级+跳转级+HTTP级+应用级) - 401响应自动处理和跳转 - 路由守卫测试页面 🔧 技术实现: - checkPageAccess() 全局页面权限检查 - guardedNavigate/guardedSwitchTab 带权限检查的跳转 - handleUnauthorized() HTTP拦截器401处理 - 公开页面配置管理 - 优雅的错误提示和跳转逻辑 📱 页面集成: - App.vue 初始化路由守卫 - profile/workbench 页面添加权限检查 - index 页面优化跳转逻辑 - 新增测试页面验证功能 📚 文档完善: - 移动端路由守卫使用指南 - 详细的变更记录和技术说明 - 最佳实践和注意事项 🎯 核心效果: 用户登录失效或未登录时，访问任何需要权限的页面都自动跳转到登录页，提升安全性和用户体验。
35 lines
759 B
Vue
35 lines
759 B
Vue
<script>
|
|
import { initRouteGuard } from '@/utils/route-guard';
|
|
|
|
export default {
|
|
onLaunch: function () {
|
|
console.log('App Launch');
|
|
|
|
// 初始化全局路由守卫
|
|
initRouteGuard();
|
|
},
|
|
onShow: function () {
|
|
console.log('App Show');
|
|
},
|
|
onHide: function () {
|
|
console.log('App Hide');
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style>
|
|
/* 引入 uview-plus 全局样式 */
|
|
@import 'uview-plus/index.scss';
|
|
|
|
/* 每个页面公共css */
|
|
page {
|
|
background-color: #f8f8f8;
|
|
}
|
|
|
|
/* 全局字体设置 */
|
|
* {
|
|
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Hiragino Sans GB',
|
|
'Microsoft YaHei', 'Helvetica Neue', Helvetica, Arial, sans-serif;
|
|
}
|
|
</style>
|