Initialize Current User Service bei Application Start in AngularJS

Question

Ich entwickle eine Single Page Application mit AngularJS.

Wenn sich ein Benutzer erfolgreich anmeldet, wird ein Sicherheitstoken in einem Cookie gespeichert. Wenn er nun die Seite aktualisiert, wird das Token an das Backend gesendet, das ein JSON-Objekt "currentUser" zurückgibt, das alle relevanten Informationen über den aktuellen Benutzer enthält (als Name, Zugriffsgruppen, Profilbild usw.).

Das Problem ist, dies ist ein asynchroner Prozess natürlich, wenn der Controller einen anderen Vorgang startet, sagen wir nur den Namen des Benutzers, dieser Wert wird zu diesem Zeitpunkt undefiniert sein.

Natürlich könnte ich eine Zeitüberschreitung einstellen, aber gibt es eine bessere Lösung?

Ich dachte über einen "currentUserService" nach, der zuerst initialisiert (sendet das Cookie und füllt die Benutzerinformationen mit der Backend-Antwort) und kann erst nach Abschluss dieser Initialisierung verarbeitet werden.

Aber wie kann das gemacht werden? Oder gibt es noch andere Möglichkeiten?

---

edit: Hallo Jungs, Dank für die Eingabe!

Ihre beiden Vorschläge scheinen für asynchrone Anfragen in der Regel sehr vielversprechend zu sein, aber ich denke, dass sie nicht perfekt für meine Sorge könnte passen:

Die Informationen über den aktuellen Benutzer nur haben, einmal angefordert werden so möchte ich sie für die gesamte Anwendung (zB im rootScope oder einem Dienst) von jedem Controller zugänglich machen, ohne sie in jedem Controller erneut anfordern zu müssen (wie im Callback oder Resolve-Lösung) aber dafür sorgen Es wird keine "Timeout" -Probleme geben. Hast du eine Idee?

Answer 1

Wenn ein Benutzer aktualisiert wird, müssen Sie alles initialisieren. Ich nehme an, das Token ist in LocalStorage oder etwas gespeichert und ich nehme an, dass dies Winkel 1 ist. Um dies zu tun, ich glaube, Sie sollten benutzerbezogenen Funktionen von Ihrem http Call-Rückruf anrufen:

$scope.user = {}; 

    $scope.getUser = function(){ 
    $http({ 
     method: 'GET', 
     url: '/someUrl' 
    }).then(function (res) { 

     $scope.user = res.data; //or whatever the response is 
     $scope.handleUserRelatedThings(); 

    }).catch(function(err) { 

     //handle error 

    }) 

    } 

    $scope.handleUserRelatedThings = function(){ 

    //do things with $scope.user 
    alert($scope.user.name); 

    } 

    //on init 
    $scope.getUser(); 

Answer 2

Sie können die Daten des Benutzers, bevor die Ansicht Lasten lösen entweder mit ng-route oder ui-router:

Dieses Beispiel geschrieben für ui-router:

.state('profile', { 
url: '/profile', 
controller: 'profileCtrl as vm', 
resolve: { 
    user: function(AuthService) { 
    //Return a promise or an object to be resolved. 
    return AuthService.getUserFromToken(); //Say this is asynchronous and returns a promise 
    } 
} 
}); 

//In controller: 
.controller('profileCtrl', function(... , user) { 
//User data available here 
this.user = user; 
}); 

Bitte beachten Sie, wenn Fehler der Zustand während der resolve Bühne auftreten werden nicht geladen, so dass Sie sich um die Fehler werden nehmen!