Django Rest框架中的用户认证+ Angular.js Web应用程序

我正在开发一个web应用程序,用户可以登录查看他们的在线酒窖。

我有Django REST模型设置,以及Angular中的前端设计,但我无法将这些部分放在一起,而我的主要问题是用户身份验证。

我在这里和各种教程阅读了很多帖子,但我似乎无法找到一步一步的方法来实现身份验证:

  • 应该使用哪种认证(令牌,会话,其他?)
  • 如何在服务器端管理身份验证(它是一个视图吗?在UserModel或UserManager中的一个方法?)
  • 我有一个自定义的用户模型(使用电子邮件作为用户名)。 我可以使用通用的Django登录方法,还是需要创建自己的?
  • 如何在服务器和客户端之间管理身份验证过程?
  • 据我所知,Angular在一个URL上发出POST请求,DRF验证用户名和密码是否匹配,并返回一个令牌或其他验证证据。

    我觉得我很接近,但我需要一个更全面的看法,说明如何将这些作品放在一起。

    提前致谢


    我想有很多方法可以做到这一点,让我解释我做了什么,希望它有帮助。 这将是一个很长的职位。 我很想听听其他人如何做到这一点,或者更好地实施相同的方法。 你也可以在Github上看看我的种子项目Angular-Django-Seed。

    我使用Witold Szczerba的http-auth拦截器进行令牌认证。 他的方法的优点是,无论何时从您的网站发送请求时没有正确的凭据,您都会被重定向到登录屏幕,但是您的请求会在登录完成后重新排队。

    这是一个与登录表单一起使用的登录指令。 它发布到Django的身份验证令牌端点,使用响应令牌设置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();
              });
        });
      }
    }
    

    })

    我使用模块.run方法来设置当用户访问网站时检查cookie,如果他们有cookie集我设置默认授权。

    .run(function($rootScope) {
      $rootScope.$broadcast('event:initial-auth');
    })
    

    这是处理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();
                 }
              });
            }
         }
      })
    

    为了使用它,我所有的html基本上都是这样。

    <body auth-application>
      <div id="login-holder">
        ... login form
      </div>
    
      <div id="main">
        ... ng-view, or the bulk of your html
      </div>
    

    查看django-rest-auth和angular-django-registration-auth

    https://github.com/Tivix/angular-django-registration-auth

    https://github.com/Tivix/django-rest-auth

    我们试图从这两个库中的后端和角度角度解决大多数常见的Django身份验证/注册相关事宜。

    谢谢!

    链接地址: http://www.djcxy.com/p/5777.html

    上一篇: User Authentication in Django Rest Framework + Angular.js web app

    下一篇: Django remote server authentication