首页 新闻 赞助 找找看

angular: router.createUrlTree 使用绝对地址问题

0
悬赏园豆:30 [已解决问题] 解决于 2022-10-15 20:36

在下面的代码中 router.createUrlTree 使用了绝对地址

export class AuthorizeGuard implements CanActivate {
  constructor(private authService: AuthService, private router: Router) {}

  canActivate(
    route: ActivatedRouteSnapshot,
    state: RouterStateSnapshot): boolean | UrlTree  {
      return this.authService.isAuthenticated() ?
        true :
        this.router.createUrlTree(
          ["https://account.cnblogs.com/signin"],
          { queryParams: { returnUrl: state.url } }
        );
  }
}

运行时却报错

Cannot match any routes. URL Segment: 'https:/account.cnblogs.com/signin'`

请问如何解决?

问题补充:

实际要解决的问题是在 guard 中跳转到外部地址(redirect to external url)

dudu的主页 dudu | 高人七级 | 园豆:31075
提问于:2022-10-15 19:05
< >
分享
最佳答案
0

UrlTree 只支持相对地址,通过下面的代码解决了

export class AuthorizeGuard implements CanActivate {
  constructor(private authService: AuthService, private router: Router) {}

  canActivate(
    route: ActivatedRouteSnapshot,
    state: RouterStateSnapshot): boolean  {
      if(this.authService.isAuthenticated()) {
        return true;
      } else {
        const path = this.router.createUrlTree(
          ["signin"],
          { queryParams: { returnUrl: location.origin + state.url } }
        ).toString();
        location.href = "https://account.cnblogs.com" + path;
        return false;
      }
  }
}
dudu | 高人七级 |园豆:31075 | 2022-10-15 20:34
清除回答草稿
   您需要登录以后才能回答,未注册用户请先注册