Javascript 如何在 angularjs 应用程序中实现安全(!)身份验证系统?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/14791361/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-24 17:56:00  来源:igfitidea点击:

How to achieve a Safe (!) authentication system in an angularjs app?

javascriptsecurityauthenticationcookiesangularjs

提问by Bruno

I'm new with angularjs...

我是 angularjs 的新手...

I read the docs, and completed the tutorial; i also tried something else by myself, and things start to make sense to me.

我阅读了文档,并完成了教程;我还自己尝试了其他东西,事情开始对我有意义。

Now i wonder how to make a safe authentication system.

现在我想知道如何制作一个安全的身份验证系统

The easy part: no code, i will describe operations my code execute:

简单的部分:没有代码,我将描述我的代码执行的操作:

I've a classic form: username, and password text input.

The user fills the form, and press ENTER.

An ajax request starts, and the response is a JSON telling me something like "ok i know you" or "i don't know who you are".

我有一个经典的形式:用户名和密码文本输入。

用户填写表单,然后按 ENTER。

一个 ajax 请求开始,响应是一个 JSON,告诉我诸如“好吧,我认识你”或“我不知道你是谁”之类的信息。

What i need now is to mantain the logged status of the visitor (or not logged) between the different views of my application.

我现在需要的是在我的应用程序的不同视图之间维护访问者的登录状态(或未登录)。

I read on the internet that, to achieve this objective, someone sets a variable ($scope.isLogged = true), someone else uses cookies; but javascript variables, and cookies can be easily edited using firebug, or similiar development tools.

我在网上读到,为了实现这个目标,有人设置了一个变量 ($scope.isLogged = true),其他人使用了 cookie;但是 javascript 变量和 cookie 可以使用 firebug 或类似的开发工具轻松编辑。

... and finally the question:

......最后的问题:

So, have you some suggestion to achieve a safe authentication system in an angularjs app?

那么,您有什么建议可以在 angularjs 应用程序中实现安全的身份验证系统吗?

采纳答案by fdreger

You cannot authorize anything in angularjs, because the user has full controll of the execution environment (namely, the browser). Each check, case, if - anything you can think of - can be tampered with. There are javascript libraries that use asymmetric keys to perform local encryption to store local data somewhat safely, but they are not what you are looking for, really.

你不能在 angularjs 中授权任何东西,因为用户完全控制了执行环境(即浏览器)。每个检查、案例,如果 - 你能想到的任何东西 - 都可以被篡改。有一些 javascript 库使用非对称密钥来执行本地加密以在某种程度上安全地存储本地数据,但它们实际上并不是您想要的。

You can, and you should, authorize things on the server - the standard way you would do it in an ordinary application - using session; no special code is necessary, ajax calls use ordinary session cookies. Application does not need to know whether it's authenticated or not. It only needs to check what server thinks.

您可以而且应该在服务器上授权——这是您在普通应用程序中执行的标准方式——使用会话;不需要特殊代码,ajax 调用使用普通会话 cookie。应用程序不需要知道它是否经过身份验证。它只需要检查服务器的想法。

From the perspective of your angularjs application, being "logged in" or "logged out" is merely a gui hint for the user.

从您的 angularjs 应用程序的角度来看,“登录”或“注销”只是用户的 gui 提示。

回答by Alexandru R

Probably you found a solution, but currently I made up an authenticaiton scheme I'm implementing in my Angular App.

可能你找到了一个解决方案,但目前我制定了一个身份验证方案,我正在我的 Angular 应用程序中实施。

On .run the app is registered with an ActiveSession set to false. It then checks if the browser has a cookie with a token and a userId.

在 .run 上,应用程序注册时将 ActiveSession 设置为 false。然后它检查浏览器是否有一个带有令牌和用户 ID 的 cookie。

If YES, check token+userId on server and updates the token on both server and local (token it's a server generated key unique for each user)

如果是,请检查服务器上的令牌+用户 ID 并更新服务器和本地上的令牌(令牌是服务器生成的每个用户唯一的密钥)

If NO shows login form, check credentials and again if they are valid does a server request t get a new token and saves is locally.

如果 NO 显示登录表单,请检查凭据,如果它们有效,服务器是否会请求获取新令牌并在本地保存。

The token is used to make a persistent login (remember me for 3 weeks) or when user refreshes the browser page.

该令牌用于进行持久登录(记住我 3 周)或当用户刷新浏览器页面时。

Thank you

谢谢

Authentication Scheme in Angular.js

Angular.js 中的身份验证方案

回答by Bruno

I asked this question three months ago.

我三个月前问过这个问题。

I would like to share what has become my favourite approach when I've to deal with user authentication in a web app built over AngularJS.

当我必须在基于 AngularJS 构建的 Web 应用程序中处理用户身份验证时,我想分享成为我最喜欢的方法。

Of course fdreger's answer is still a great answer!

当然 fdreger 的回答仍然是一个很好的答案!

You cannot authorize anything in angularjs, because the user has full controll of the execution environment (namely, the browser).

From the perspective of your angularjs application, being "logged in" or "logged out" is merely a gui hint for the user.

你不能在 angularjs 中授权任何东西,因为用户完全控制了执行环境(即浏览器)。

从您的 angularjs 应用程序的角度来看,“登录”或“注销”只是用户的 gui 提示。

So, briefly my approach consists in:

所以,简而言之,我的方法包括:

1) Bind to each route additional information about the route itself.

1)绑定到每条路由关于路由本身的附加信息。

$routeProvider.when('/login', { 
    templateUrl: 'partials/login.html', controller: 'loginCtrl', isFree: true
});

2) Use a service to mantain the data about each user, and their authentication status.

2)使用服务来维护每个用户的数据,以及他们的身份验证状态。

services.factory('User', [function() {
    return {
        isLogged: false,
        username: ''
    };
}]);

3) Everytime the user try to access a new route, check if they have the grant to access.

3)每次用户尝试访问新路由时,检查他们是否有权访问。

$root.$on('$routeChangeStart', function(event, currRoute, prevRoute){
    // prevRoute.isFree tell me if this route is available for all the users, or only for registered user.
    // User.isLogged tell me if the user is logged
})

I also wrote about this approach (more in detail) on my blog, users authentication with angularjs.

我还在我的博客上(更详细地)写了关于这种方法的文章,使用 angularjs 进行用户身份验证

回答by geekonaut

First of all: Client-side data can always be manipulated or tampered with.

首先:客户端数据总是可以被操纵或篡改的。

As long as valid session IDs aren't easily guessable and measures like associating session tokens with the client's IP there is no big deal about it.

只要有效的会话 ID 不容易被猜测,并且采取诸如将会话令牌与客户端的 IP 相关联的措施,就没有什么大不了的。

You could, in theory, also encrypt the cookie, as long as you do so on the server side.

理论上,您也可以加密 cookie,只要您在服务器端这样做。

For details on how to encrypt your cookies, see the docs of your server-side (e.g http://expressjs.com/api.html#res.cookiefor Express.js)

有关如何加密 cookie 的详细信息,请参阅服务器端的文档(例如http://expressjs.com/api.html#res.cookiefor Express.js)

回答by webmaster_sean

You need to learn about the server side / database end of it.

您需要了解它的服务器端/数据库端。

User logins need to be stored somewhere - 99.9% of the time this is in a server side database.

用户登录信息需要存储在某个地方 - 99.9% 的时间是在服务器端数据库中。

Ideally for a really secure system you want a backend (server side) membership system that stores the session in a database table that is related to the member table that holds the encrypted password, but also provides a RESTful interface where you can build your api calls to.

理想情况下,对于真正安全的系统,您需要一个后端(服务器端)会员系统,该系统将会话存储在与保存加密密码的成员表相关的数据库表中,但还提供了一个 RESTful 接口,您可以在其中构建 api 调用到。

One Script that I've used successfully a lot has been Amember https://www.amember.com/. It's a really cost effective way to go although there are a lot of other script out there, I've had a lot of success with this one.. It's also PHP so you can build your build out an API for your angular http calls really easily.

我经常成功使用的一个脚本是 Amember https://www.amember.com/。尽管还有很多其他脚本,但这是一种非常划算的方法,我在这个脚本上取得了很大的成功。它也是 PHP,因此您可以为您的 angular http 调用构建 API容易地。

All of these javascript frameworks are great but the effect is that now too many are focusing too much on the front end of things - learn the database / backend as well! :-)

所有这些 javascript 框架都很棒,但结果是现在太多的东西过于专注于前端——还要学习数据库/后端!:-)