Question

我想重定向那些在尝试访问受保护的路由时未登录的用户，但重定向不起作用，因为检查用户是否已登录的功能返回一个Observable。

这是我在PrivateGuard中的代码：

import { RouterModule, Routes } from '@angular/router';
import { LoginComponent } from './components/public/login/login.component';
import { HomeComponent } from './components/private/home/home.component';

const APP_ROUTES: Routes = [
  { path: 'login', component: LoginComponent},
  { path: 'home', component: HomeComponent, canActivate: [PrivateGuard] },
  { path: '**', pathMatch: 'full', redirectTo: 'home' }
];

export const APP_ROUTING = RouterModule.forRoot(APP_ROUTES);

app.routes.ts：

import { Injectable } from '@angular/core';
import { CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot, Router } from '@angular/router';
import { AmplifyService } from 'aws-amplify-angular';
import { Observable } from 'rxjs';

@Injectable({
  providedIn: 'root'
})
export class PrivateGuard implements CanActivate {

  constructor (private _router: Router,
               private _amplifyService: AmplifyService) {}

  canActivate(next: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<boolean> | Promise<boolean> | boolean {
    return this._amplifyService.auth().currentAuthenticatedUser()
      .then(() => {
        return true;
      })
      .catch(() => {
        this._router.navigate(['/login']);
        return false;
      });
  }
}

如果我在登录时在else语句中写console.log，则该console.log会显示在控制台中，但永远不会重定向到homeComponent

Console when I try navigate to a private route

The route in url dissapears, instead of localhost:4200/login

谢谢您的回复。

已解决

最后，我使用promise而不是可观察的。代码如下：

user> (defrecord Blah
          [x y]

        clojure.lang.IFn
        (invoke [o arg] (arg o)))

user> (let [obj (->Blah 1 2)]
        [(obj :x) (obj :y)])
[1 2]

谢谢大家的回答

Answer 1

您的可观察对象可能永远无法完成，它仍在等待authStateChange $发出更多值。

您可以使用take运算符（在发出一个值后取消订阅：

return this._amplifyService.authStateChange$.pipe(
   take(1), // completes the observable on first emited value
   map(authState => /* */)
);

守卫返回Observable时，Angular路由器不起作用

1 个答案: