从应用B重定向回来源应用A时的代码错误排查

我有一个嵌入在应用A中的应用B，用户从应用A点击进入应用B。我通过DirectService服务存储来源URL/URI：

export class DirectService {
  private redirect_uri: any;
  constructor() {}

  setRedirectUri(userUri): void {
    this.redirect_uri = userUri;
  }
  getRedirectUri() {
    return this.redirect_uri;
  }
}

在容器初始化时，我通过this.redirectService.setRedirectUri(document.referrer);设置redirect_uri（根据MDN文档，该值应为链接到B的应用A页面）。

我设置了一个按钮，点击时执行以下函数：

onClose(): void {
    window.location.href(this.redirectService.getRedirectUri());
}

此时href报错：This expression is not callable. Type 'String' has no call signatures

我尝试改用router：this.router.navigate(this.redirectService.getRedirectUri())，但出现错误：

main.js:1 ERROR TypeError: J.reduce is not a function
    at ee (main.js:1:2481641)
    at At (main.js:1:2480222)

请问我哪里出错了？

1. window.location.href 报错的原因 #

window.location.href 是字符串属性，不是函数，不能通过调用的方式赋值。正确写法是直接赋值：

onClose(): void {
    window.location.href = this.redirectService.getRedirectUri();
}

如果需要确保跳转的是外部链接，可额外检查URL是否包含http/https协议头，避免相对路径错误。

2. 使用router.navigate报错的原因 #

Angular的router.navigate()方法接收的参数是路由数组（比如['/home', 'detail']），而非完整的URL字符串，它仅用于应用内部路由导航，不适合跳转到外部应用（应用A）的URL。

另外，建议给DirectService里的变量加上明确类型声明，避免any类型带来的潜在问题：

export class DirectService {
  private redirect_uri: string;
  constructor() {}

  setRedirectUri(userUri: string): void {
    this.redirect_uri = userUri;
  }
  getRedirectUri(): string {
    return this.redirect_uri;
  }
}

内容的提问来源于stack exchange，提问作者GustaMan9000