Angular 2 Route Guard/Auth Guard 安全

Question

我刚刚在 Angular 大学完成了关于 Angular 2 和 Firebase 的 Angular 2 类(class)。

讲师 Vasco (@angular-university) 提出 Router Guard 不安全，您可以绕过它，因为它是一个前端框架。

我们使用 Firebase Auth 来了解用户是否经过身份验证，并设置安全规则以防止读取/写入，除非用户经过身份验证。所以，我知道数据受到保护。

但是，这条路线真的安全吗？他提到使用服务器后端来提高安全性，但没有详细说明。

我一直在尝试四处搜索，但没能看到其他人在哪里提出过这个问题。

归根结底，Angular 2 路由防护本身是安全的还是您必须实现服务器来保护路由？无论如何，用户将如何绕过路由？

谢谢!

Answer 1

您描述的问题不是 Angular 特有的。所有 JavaScript 应用程序都面临着相同的安全问题。

Vasco 强调路由守卫只是部分安全是正确的。它们只是在客户端浏览器中执行的一段代码。如果用户可以调整此代码(例如，在他们的浏览器内存中)，他们可能会改变它的工作方式。

在实践中，这并不一定容易，因为部署的代码被缩小、丑化、捆绑……但在较低级别，您的 Angular 应用程序只是服务器上的一堆静态 HTML/JS/CSS 文件。这些文件通常可以公开访问:任何知道其 URL 的人都可以下载它们并浏览其源代码。问问自己如果有人阅读您应用文件的源代码，您会冒哪些风险。您永远不应在这些文件中存储敏感信息。

作为一般规则，如果您已经保护了后端，您就完成了大部分工作。想象一下，一个恶意用户找到了一种方法来激活您的一条 protected 路线。后端仍然不会为该路由返回任何数据，页面上也不会显示任何内容。相反，您应该确保任何敏感操作都咨询后端(例如，不要让用户仅仅因为他们可以看到并点击浏览器中的“转账”按钮就转账；后端应该验证他们已经过身份验证并且有足够的资金)。

现在，如果您想要额外的安全层，您可以要求用户经过身份验证才能访问您应用程序的静态 Assets (index.html、.js文件...)，但您需要使用支持该文件的服务器(Firebase 托管不支持 AFAIK)，实际上这很少是必需的。

退一步说，保护单页应用不仅仅是保护其路由。有跨站点脚本、点击劫持等。

以下是您可以查看的一些资源:

• Angular.io 的安全章节 - https://angular.io/guide/security
• AngularJS 安全:保护您的单页应用程序 - https://slideshare.net/carlo.bonamico/angularjs-security-defend-your-single-page-application (虽然说的是AngularJS，但好像也有有趣的地方)
• JavaScript 的 OWASP Top 10 - http://erlend.oftedal.no/blog/?blogid=125 (前 10 大最严重的 Web 应用程序安全风险)