Python Django Rest Framework + Angular.js Web 应用程序中的用户身份验证
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/20498317/
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
User Authentication in Django Rest Framework + Angular.js web app
提问by bpipat
I'm working on a webapp where users can login to see their online wine cellar.
我正在开发一个网络应用程序，用户可以在其中登录以查看他们的在线酒窖。
I've got the Django REST models setup, as well as the front-end design in Angular but I'm having trouble putting the pieces together and my main issue is for user authentication.
我已经设置了 Django REST 模型，以及 Angular 中的前端设计，但是我无法将这些部分放在一起，我的主要问题是用户身份验证。
I've read many posts on here and various tutorials but I can't seem to find a step by step method to implement authentication:
我在这里阅读了许多帖子和各种教程，但似乎找不到实现身份验证的分步方法：
- What kind of auth should be used (Token, Session, Other?)
- How is authentication managed on the server side (is it a view? a method in the UserModel or UserManager?)
- I have a custom User model (using email as username). Can I use the generic Django login method or do I need to create my own?
- How is the authentication process managed between the server and client side?
- 应该使用什么样的身份验证（令牌、会话、其他？）
- 在服务器端如何管理身份验证（它是一个视图？UserModel 或 UserManager 中的一个方法？）
- 我有一个自定义用户模型（使用电子邮件作为用户名）。我可以使用通用的 Django 登录方法还是需要创建自己的方法？
- 服务器端和客户端之间的身份验证过程是如何管理的？
From what I understand Angular makes a POST request on a url where DRF verifies that username and password match and returns a token or other auth proof.
据我了解，Angular 在 url 上发出 POST 请求，其中 DRF 验证用户名和密码匹配并返回令牌或其他身份验证证明。
I feel like I'm close but I need a more general view of how this works to put the pieces together.
我觉得我已经很接近了，但我需要更全面地了解这是如何将各个部分放在一起的。
Thanks in advance
提前致谢
采纳答案by Zack Argyle
I imagine there are a lot of ways to do this, let me explain what I do, hopefully it is helpful. This is going to be a long post. I would love to hear how others do this, or better ways of implementing the same approach. You can also check out my seed project on Github, Angular-Django-Seed.
我想有很多方法可以做到这一点，让我解释一下我的工作，希望它会有所帮助。这将是一个很长的帖子。我很想听听其他人是如何做到这一点的，或者是实施相同方法的更好方法。您还可以在 Github 上查看我的种子项目Angular-Django-Seed。
I use token authentication with Witold Szczerba's http-auth-interceptor. The beauty of his approach is that whenever a request is sent from your site without proper credentials, you are redirected to the login screen, but your request is queued to be re-fired on login complete.
我将令牌身份验证与 Witold Szczerba 的http-auth-interceptor 一起使用。他的方法的美妙之处在于，只要在没有正确凭据的情况下从您的站点发送请求，您就会被重定向到登录屏幕，但您的请求会排队等待登录完成后重新触发。
Here is a login directive used with the login form. It posts to Django's auth token endpoint, sets a cookie with the response token, sets the default header with the token so all requests will be authenticated, and fires the http-auth-interceptor login event.
这是与登录表单一起使用的登录指令。它发布到 Django 的 auth 令牌端点，使用响应令牌设置 cookie，使用令牌设置默认标头以便对所有请求进行身份验证，并触发 http-auth-interceptor 登录事件。
.directive('login', function ($http, $cookieStore, authService) {
return {
restrict: 'A',
link: function (scope, elem, attrs) {
elem.bind('submit', function () {
var user_data = {
"username": scope.username,
"password": scope.password,
};
$http.post(constants.serverAddress + "api-token-auth", user_data, {"Authorization": ""})
.success(function(response) {
$cookieStore.put('djangotoken', response.token);
$http.defaults.headers.common['Authorization'] = 'Token ' + response.token;
authService.loginConfirmed();
});
});
}
}
})
})
I use the module .run method to set check for the cookie when a user comes to the site, if they have the cookie set I set the default authorization.
当用户访问站点时，我使用模块 .run 方法设置对 cookie 的检查，如果他们设置了 cookie，我将设置默认授权。
.run(function($rootScope) {
$rootScope.$broadcast('event:initial-auth');
})
Here is my interceptor directive that handles the authService broadcasts. If login is required, I hide everything and show the login form. Otherwise hide the login form and show everything else.
这是我处理 authService 广播的拦截器指令。如果需要登录，我会隐藏所有内容并显示登录表单。否则隐藏登录表单并显示其他所有内容。
.directive('authApplication', function ($cookieStore, $http) {
return {
restrict: 'A',
link: function (scope, elem, attrs) {
var login = elem.find('#login-holder');
var main = elem.find('#main');
scope.$on('event:auth-loginRequired', function () {
main.hide();
login.slideDown('fast');
});
scope.$on('event:auth-loginConfirmed', function () {
main.show();
login.slideUp('fast');
});
scope.$on('event:initial-auth', function () {
if ($cookieStore.get('djangotoken')) {
$http.defaults.headers.common['Authorization'] = 'Token ' + $cookieStore.get('djangotoken');
}
else {
login.slideDown('fast');
main.hide();
}
});
}
}
})
To use it all my html was basically like this.
为了使用它，我的 html 基本上是这样的。
<body auth-application>
<div id="login-holder">
... login form
</div>
<div id="main">
... ng-view, or the bulk of your html
</div>
回答by chachra
Check out django-rest-auth and angular-django-registration-auth also
检查 django-rest-auth 和 angular-django-registration-auth
https://github.com/Tivix/angular-django-registration-auth
https://github.com/Tivix/angular-django-registration-auth
https://github.com/Tivix/django-rest-auth
https://github.com/Tivix/django-rest-auth
We've tried to solve most common Django auth/registration related things from a backend and angular perspective in these two libraries.
我们试图从后端和角度的角度解决这两个库中最常见的 Django 身份验证/注册相关的问题。
Thanks!
谢谢！
