AngularJS (Restangular): Einen Versprechensblock machen? Müssen Sie es verwenden, um ein Token zu validieren

Question

Ich bin auf Restangular gestoßen, um Anrufe zu einem Restdienst zu machen. Es funktioniert großartig und gibt ein Versprechen. Ich muss den Anruf blockieren können. Der Grund dafür ist ein Neuladen der Seite. Ich bin technisch nicht eingeloggt, aber möglicherweise habe ich ein Token in einem Cookie gespeichert. Ich möchte dieses Token gegen einen Restdienst validieren. Problem ist, dass ich es blockieren muss.

Wenn ein Timeout auftritt oder wenn es nicht gültig ist, kann ich den Benutzer als nicht authentifiziert behandeln.

Dies ist der Grund für die Blockierung ist, dass ich sie mit $ location.path zu einer neuen URL umleiten möchten, es ist kein gültiges Token.

Dies passiert nicht auf einer bestimmten Route, so dass ich keine Auflösung verwenden kann, die blockiert. Es passiert technisch auf jeder Route - ich benutze $ on. $ RouteChangeStart und überprüfe, ob eine interne Variable LoggedIn ist oder nicht, wenn ich nicht eingeloggt bin, suche ich nach dem gespeicherten Token.

Dies geschieht auf jeder Seite aktualisieren, aber nicht während der Navigation in der Anwendung.

Der Affekt, den ich versuche zu bekommen, ist, wie Google Mail funktioniert.

Freuen Sie sich auf die Einsicht jemand auf diesem

Dank

Answer 1

Grundsätzlich müssen Sie sicherstellen, dass eine asynchrone Aktion auftritt, bevor eine Route geändert wird. In diesem Fall authentifiziert die Aktion einen Benutzer.

Was können Sie tun, ist das $routeChangeStart Ereignis zu verwenden, um emittieren ist wie so eine Eigenschaft zum resolve Objekt auf der Route hinzuzufügen:

function authenticate() { 
    if (user.isAuthenticated) { 
     return; 
    } 
    // Just fake it, but in a real app this might be an ajax call or something 
    return $timeout(function() { 
     user.isAuthenticated = true; 
    }, 3000); 
} 

$rootScope.$on("$routeChangeStart", function(e, next) { 
    console.log("$routeChangeStart"); 
    next.resolve = angular.extend(next.resolve || {}, { 
     __authenticating__: authenticate 
    }); 
}); 

Da Winkel für Versprechen in dem resolve Objekt warten wird Bevor Sie fortfahren, müssen Sie eine Pseudoabhängigkeit wie im Beispiel verwenden. Wenn Sie so etwas verwenden, sollten Sie sicherstellen können, dass sich Ihr Benutzer authentifiziert, bevor Routen erfolgreich ausgeführt werden.

Beispiel: http://jsfiddle.net/hLddM/

Answer 2

Ich denke, die beste Art und Weise, dies zu tun könnte den Benutzer um mit $ location.path zu drücken, können Sie verwenden .then() um effektiv eine Wartezeit zu erzwingen, indem der Benutzer auf einer Ladeseite belassen wird.

var currentPath = $location.path(); 

$location.path(loadingScreen); 

//Assuming you have some sort of login function for ease. 
Restangular.login(token).then(
    function(result) { 
     $location.path(currentPath) 
    }, 
    function(error) { 
     $location.path(logInScreen) 
    } 
); 

Answer 3

Wenn Sie ui-Router verwenden, können Sie in einem anderen Zustand mit der gleichen URL bewegen, wo Sie, dass Restangular.login mit der dann verwenden würden, und im Erfolgsfall auf den zurückgehen " Login "State, ansonsten, gehen Sie in den" Login "Zustand, in dem der Benutzer seinen Benutzernamen und sein Passwort eingeben müssen.

Wenn Sie nicht Ui-Router verwenden, könnten Sie etwas mit dem ng-switch implementieren.

Also, bei der Ankunft auf dem Bildschirm, tun Sie das Restangular.login und standardmäßig zeigen Sie laden Seite durch einige Boolean auf wahr. Wenn dies nicht der Fall ist, senden Sie ihn zum Login, andernfalls setzen Sie loading auf false und zeigen die Seite an.

Auf jeden Fall würde ich empfehlen, ui-Router verwenden, es rockt :)

Hope this funktioniert!