python django angular 4




Benutzerauthentifizierung in Django Rest Framework+Angular.js Web App (2)

Ich kann mir vorstellen, dass es viele Möglichkeiten gibt, dies zu tun, lassen Sie mich erklären, was ich tue, hoffentlich ist es hilfreich. Dies wird ein langer Post sein. Ich würde gerne hören, wie andere dies tun, oder besser, wie sie denselben Ansatz umsetzen. Du kannst auch mein Samen-Projekt auf Github, Angular-Django-Seed .

Ich benutze Token-Authentifizierung mit Witold Szczerbas http-auth-interceptor . Das Schöne an diesem Ansatz ist, dass Sie immer dann, wenn eine Anfrage von Ihrer Site ohne die entsprechenden Anmeldeinformationen gesendet wird, zum Anmeldebildschirm weitergeleitet werden, Ihre Anfrage jedoch in der Warteschlange steht, um bei der Anmeldung erneut ausgelöst zu werden.

Hier ist eine Login-Direktive, die mit dem Login-Formular verwendet wird. Er sendet den Authentifizierungs-Token-Endpunkt von Django, setzt einen Cookie mit dem Antwort-Token, setzt den Standard-Header mit dem Token, so dass alle Anfragen authentifiziert werden, und löst das Anmeldeereignis http-auth-interceptor aus.

.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();
          });
    });
  }
}

})

Ich benutze die Modul.run-Methode, um die Suche nach dem Cookie zu setzen, wenn ein Benutzer auf die Site kommt. Wenn sie den Cookie gesetzt haben, setze ich die Standardautorisierung.

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

Hier ist meine Interceptor-Direktive, die die authService-Broadcasts behandelt. Wenn Login erforderlich ist, verstecke ich alles und zeige das Login-Formular an. Ansonsten verstecken Sie das Login-Formular und zeigen Sie alles andere an.

.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();
             }
          });
        }
     }
  })

Um es zu benutzen, war mein HTML im Grunde so.

<body auth-application>
  <div id="login-holder">
    ... login form
  </div>

  <div id="main">
    ... ng-view, or the bulk of your html
  </div>

Ich arbeite an einer Webapp, auf der sich Benutzer einloggen können, um ihren Online-Weinkeller zu sehen.

Ich habe die REST-Modelle von Django sowie das Frontend-Design in Angular, aber ich habe Probleme, die Teile zusammenzusetzen, und mein Hauptproblem ist die Benutzerauthentifizierung.

Ich habe viele Beiträge hier und verschiedene Tutorials gelesen, aber ich kann keine Schritt-für-Schritt-Methode finden, um die Authentifizierung zu implementieren:

  • Welche Art von Auth sollte verwendet werden (Token, Session, Other?)
  • Wie wird die Authentifizierung auf der Serverseite verwaltet (ist es eine Ansicht? Eine Methode im UserModel oder UserManager?)
  • Ich habe ein benutzerdefiniertes Benutzermodell (E-Mail als Benutzername). Kann ich die generische Django-Login-Methode verwenden oder muss ich meine eigene erstellen?
  • Wie wird der Authentifizierungsprozess zwischen Server- und Client-Seite verwaltet?

Soweit ich weiß, macht Angular eine POST-Anfrage an eine URL, bei der DRF überprüft, ob Benutzername und Passwort übereinstimmen, und ein Token oder einen anderen Authentifizierungsnachweis zurückgibt.

Ich fühle mich, als wäre ich nah dran, aber ich brauche eine allgemeinere Sichtweise, wie das funktioniert, um die Teile zusammenzufügen.

Danke im Voraus








django-rest-framework