Angular 2 Route Guard/Auth Guard安全性 [英] Angular 2 Route Guard / Auth Guard Security

问题描述

我刚刚在Angular大学完成了有关Angular 2和Firebase的Angular 2课程.

I just finished an Angular 2 course on Angular 2 and Firebase at Angular-University.

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

The instructor, Vasco (@angular-university) brought up that the Router Guard is not secure and you could bypass it since its a front-end framework.

我们使用Firebase Auth来了解用户是否已通过身份验证，并设置了安全规则以防止除非用户通过身份验证才进行读/写.因此，我知道数据受到保护.

We used Firebase Auth to know if a user is authenticated and setup the security rules to prevent read/write unless a user is authenticated. So, I know the data is protected.

但是，路线实际上是安全的吗?他提到使用服务器后端来提高安全性，但没有涉及任何细节.

However, is the route actually secure? He mentioned using a sever backend to for more security but didn't go in to any details.

我一直在尝试搜索，但是我无法看到其他人提出的建议.

I've been trying to search around but I haven't been able to see where anyone else has brought this up.

在一天结束时，Angular 2路由器防护本身是否安全，还是必须实现服务器来保护路由?无论如何，用户将如何绕过路线?

At the end of the day, is the Angular 2 router guard secure on its own or do you have to implement a server to protect routes? How would a user bypass the routes anyway?

谢谢！

推荐答案

您描述的问题并非特定于Angular.所有JavaScript应用程序都面临相同的安全问题.

The problem you describe is not specific to Angular. All JavaScript applications face the same security concerns.

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

Vasco is right to highlight that route guards are only partly secure. They're just a piece of code executed in the client's browser. If the user could temper with this code (in their browser memory, for instance) they could potentially change the way it works.

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

In practice this is not necessarily easy as the deployed code is minified, uglified, bundled... But at a lower-level your Angular app is just a bunch of static HTML/JS/CSS files sitting on a server. These files are often publicly accessible: anyone knowing their URLs can download them and browse their source code. Ask yourself which risks you'd run if someone were to read the source code of your app files. You should never store sensitive information in these files.

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

As a general rule, if you have secured your backend you've done the bulk of the work. Imagine a malicious user found a way to activate one of your guarded routes. The backend would still return no data for this route and there'd be nothing to display on the page. Conversely you should see to it that any sensitive operation consults the backend (e.g. don't let users transfer money just because they can see and click the "Transfer" button in their browser; the backend should verify that they're authenticated and that they have sufficient funds).

现在，如果您希望获得额外的安全性，则可以要求用户经过身份验证才能访问应用程序的静态资产(index.html，.js文件...)，但是您需要使用支持该功能的服务器(Firebase托管不支持AFAIK)，实际上，这几乎是不必要的.

Now if you wanted that extra layer of security, you could require that users be authenticated to access even the static assets of your app (index.html, .js files...) but you'd need to use a server which supports that (Firebase hosting doesn't AFAIK) and in practice this is seldom necessary.

退一步，保护单页应用程序不仅仅可以保护其路由.有跨站点脚本，点击劫持等.

Taking a step back, securing a single-page app is about more than securing its routes. There's cross-site scripting, click-jacking, etc.

以下是您可以检出的一些资源:

Here are some resources that you could check out:

• Angular.io的安全性章节- https://angular.io/guide/security
• AngularJS安全:保护您的单页应用程序- https ://slideshare.net/carlo.bonamico/angularjs-security-defend-your-single-page-application (尽管它与AngularJS有关，但似乎有一些有趣的观点)
• OWASP JavaScript排名前10位- http://erlend.oftedal.no/blog/? blogid = 125 (十大最关键的Web应用程序安全风险)

• Angular.io's security chapter - https://angular.io/guide/security
• AngularJS Security: defend your Single Page Application - https://slideshare.net/carlo.bonamico/angularjs-security-defend-your-single-page-application (it seems to have interesting points even though it's about AngularJS)
• OWASP Top 10 for JavaScript - http://erlend.oftedal.no/blog/?blogid=125 (top 10 most critical web application security risk)

这篇关于Angular 2 Route Guard/Auth Guard安全性的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！