Angular 到基础 href 之外的 URL 的路由

Question

当我们 Angular 应用程序中的服务执行 HTTP 请求时，我们希望将用户定向到登录页面。

这是我们的设置：

https://foo.bar/ui <-- 我们的 angular 应用程序，位于 'base-href=/ui'
https://foo.bar/login <-- 我们的登录页面，完全不同的应用程序

这是我们正在尝试的：

@Injectable({
    providedIn: 'root'
})
export class ServiceHelper {
    constructor(private router: Router) {}

    public handleError<T>(result?: T): (error: any) => Observable<T> {
        {
            return (error: HttpErrorResponse): Observable<T> => {
                if (error.status === 401) {
                    // Direct the user to login
                    this.router.navigate(['/login']);
                }
                console.error(error);
                return of(result as T);
            };
        }
    }
}

问题是在 401 上，浏览器被定向到 https://foo.bar/ui/login。我们运行我们的 angular.json 中有 'base-href=/ui' 的应用程序。我们的登录应用程序是一个不同的系统，在 base-href 之外。

有什么好的方法可以让 Angular 的路由器在同一服务器上，在 base-href 之外以绝对 URL 重定向用户？

谢谢！

Answer 1

使用HTTP拦截器拦截请求对象中的URL。如果 URL 包含“登录”作为子字符串，请将 URL 替换为 https://foo.bar/login。

可能会有帮助

Answer 2

Angular 路由器仅用于应用程序的内部路由。要从应用程序导航到外部路由，我会使用 Window 对象。 Check it out here

Angular 到基础 href 之外的 URL 的路由

Angular route to a URL outside the base href

angular-routing

angular