Ich habe einen AuthGuard (für das Routing verwendet), der CanActivate implementiert .
canActivate() {
return this.loginService.isLoggedIn();
}
Mein Problem ist, dass das CanActivate-Ergebnis von einem http-get-Ergebnis abhängt - der LoginService gibt ein Observable zurück .
isLoggedIn():Observable<boolean> {
return this.http.get(ApiResources.LOGON).map(response => response.ok);
}
Wie kann ich diese zusammenbringen - damit CanActivate von einem Backend-Status abhängt?
# # # # # #
EDIT: Bitte beachten Sie, dass diese Frage aus dem Jahr 2016 stammt - ein sehr frühes Stadium von Angular / Router wurde verwendet.
# # # # # #
angular
angular2-routing
angular2-http
Philipp
quelle
quelle
canActivate()
kann ein zurückgebenObservable
, stellen Sie einfach sicher, dass dasObservable
abgeschlossen ist (dh.observer.complete()
).take(1)
Rx-Operators, um die Vollständigkeit des Streams zu erreichen. Was ist, wenn ich vergesse, ihn hinzuzufügen?Antworten:
Sie sollten "@ angle / router" auf den neuesten Stand bringen. zB "3.0.0-alpha.8"
Ändern Sie AuthGuard.ts
Wenn Sie Fragen haben, fragen Sie mich!
quelle
isLoggedIn()
eine istPromise
, können Sie dies tun.isLoggedIn().then((e) => { if (e) { return true; } }).catch(() => { return false; });
Hoffentlich hilft dies zukünftigen Reisenden!import 'rxjs/add/observable/of';
Aktualisierung der Antwort von Kery Hu für Angular 5 und RxJS 5.5, bei denen der
catch
Bediener veraltet ist. Sie sollten jetzt den Operator catchError in Verbindung mit Operatoren für Pipe und Vermietung verwenden .quelle
canActivate () akzeptiert
Observable<boolean>
als zurückgegebenen Wert. Der Wachmann wartet, bis sich das Observable aufgelöst hat, und überprüft den Wert. Wenn 'true', besteht es die Prüfung, andernfalls (andere Daten oder ausgelöste Fehler) wird die Route abgelehnt.Sie können die Verwendung
.map
Operator der TransformationObservable<Response>
zuObservable<boolean>
etwa so:quelle
Ich habe es so gemacht:
Wie Sie sehen, sende ich eine Fallback-Funktion an userService.auth, was zu tun ist, wenn der http-Aufruf fehlschlägt.
Und in userService habe ich:
quelle
Dies kann Ihnen helfen
quelle
CanActivate funktioniert mit Observable, schlägt jedoch fehl, wenn zwei Aufrufe wie CanActivate getätigt werden: [Guard1, Guard2].
Wenn Sie hier ein Observable of false von Guard1 zurückgeben, wird auch Guard2 eingecheckt und der Zugriff auf die Route ermöglicht, wenn Guard2 true zurückgibt. Um dies zu vermeiden, sollte Guard1 einen Booleschen Wert anstelle von Observable of Boolean zurückgeben.
quelle
In canActivate () können Sie eine lokale boolesche Eigenschaft zurückgeben (in Ihrem Fall standardmäßig false).
Im Ergebnis des LoginService können Sie den Wert dieser Eigenschaft ändern.
quelle