Angular应用技术咨询：TypeScript代码可查性与路由守卫安全问题

1. 终端用户能通过浏览器开发者工具查看Angular应用的TypeScript代码吗？ #

要看项目的构建配置：

• 开发环境下，Angular CLI默认开启源映射（source maps），用户在浏览器Sources面板里能直接看到完整的TypeScript代码；
• 生产环境如果没关闭源映射（angular.json里sourceMap设为true），用户也能通过源映射反查到TS代码。要是生产构建时关掉了源映射，用户只能看到混淆压缩后的JavaScript，没法直接获取TS代码。

2. 路由守卫相关的几个问题 #

用户能查到是什么守卫拦截了路由，还能看它的代码吗？ #

可以：

• 有源映射的情况下，用户能在导航被拦截时打调试断点，顺着调用栈找到对应的守卫类，直接查看TS代码；
• 没源映射的话，用户也能分析混淆后的JS代码，结合路由拦截的行为、报错信息，定位到守卫的逻辑，只是代码可读性差很多。

用户能手动设置localStorage字段绕过守卫吗？ #

当然可以。localStorage是存在用户本地浏览器里的数据，用户打开开发者工具的Application面板，就能直接添加或修改目标字段，只要满足守卫的检查条件，就能访问受保护路由。

重要提醒：前端路由守卫只是前端层面的权限校验，完全不能替代后端的权限控制。真正敏感的接口必须在后端也做身份和权限验证，不然用户就算绕过前端守卫，也能直接调用接口拿数据。

内容的提问来源于stack exchange，提问作者Urooj