Angular2 Redirect nach der Anmeldung
Ich erstelle ein Authentifizierungssystem in angular2 mit der Idee, dass, wenn ein Benutzer, der nicht authentifiziert ist, versucht, zu einer "geschützten" URL zu navigieren, der Benutzer auf die Anmeldeseite umleitet und die URL einen Abfrageparameter eingibt "next" genannt, das dem Login-System hilft, den Benutzer dorthin zurückzuleiten, wo er sein möchte.
login?next=my-redirect-url
Um meine Komponenten zu schützen, verwende ich den Dekorator @CanActivate(isUserAuthenticated) in allen. Die isUserAuthenticated -Funktion ist etwas wie folgt:
Dieser Ansatz funktioniert nicht, weil die urlPath -Eigenschaft von nextInstr nicht die "vollständige" URL anzeigt (es fehlen beispielsweise Abfrageparameter).
Gibt es eine Möglichkeit, die komplette URL von einer ComponentInstruction Instanz wie nextInstr ?
2 Antworten
Ja, es gibt einen Weg:
%Vor%Sagen wir folgendes Strukturbeispiel in Abhängigkeit von routeconfig:
%Vor%Und dann verwenden Sie navigationByUrl, um zur folgenden URL zu navigieren
%Vor%Ich habe es mit meinem Beispiel getestet und das Ergebnis sieht man auf dem Bild:
%Vor% 
Eine andere Möglichkeit (OHNE Verwendung von Abfrageparametern mit @ angular / router 3.0.0), dieselbe Anforderung nach der Authentifizierung auf die ursprünglich angeforderte Ressource zu übertragen, ist die Verwendung von RouterStateSnapshot.url , einer Zeichenfolge, die die URL der Ressource, die der Benutzer angefordert hat. Bevor Sie den Benutzer nach einem fehlgeschlagenen Authentifizierungsversuch innerhalb des Hook CanActivate auf das Login-Formular umleiten, rufen Sie die angeforderte URL von RouterStateSnapshot.url ab und speichern sie in einer Variablen, auf die Ihre Login-Funktion zugreifen kann. Wenn sich der Benutzer erfolgreich anmeldet, leiten Sie einfach zur gespeicherten URL um. Hier ist mein Beispiel:
Mein AuthService (unten), der die Anmeldung durchführt, leitet den Benutzer bei erfolgreicher Anmeldung an die ursprünglich angeforderte Ressource weiter.
%Vor%So kann sich Ihre Anwendung die ursprünglich angeforderte Ressource OHNE Abfrageparameter merken.
Weitere Einzelheiten finden Sie in der Beispielanleitung unter angular.io, beginnend mit dem Abschnitt "GUARD THE ADMIN FEATURE": Ссылка
Hoffe das hilft jemandem.
Tags und Links angular angular2-routing