javascript - Angular 9 : Unable to redirect to a specific route in angular app after redirecting from an external url

Question

我有一个使用版本 9 的 Angular 应用程序。从我的一条路线(例如 /search/details/id )，我使用从 API 响应收到的 URL 值重定向到外部 URL，例如

window.location.href = "https://www.payment.com";

现在我被重定向到外部支付页面，在那里我可以进行支付或取消交易。
如果我单击取消，我将被重定向回上一页，这是我的 Angular 应用程序，路线为 /search/details/:id .从这里，如果我点击浏览器的返回按钮，我将被带到付款页面 https://www.payment.com .我想导航到 Angular 应用程序 /搜索 路线，而不是我最初导航到/search/details/id 的路线。
我尝试通过以下方式处理组件中的浏览器后退按钮，

1. fromEvent(window, 'popstate')
      .subscribe((e) => {
        console.log(e, 'back button');
        this.router.navigate(
          ['/search']);
   });
   Added inside the constructor of the component corresponding to /search/details/:id

2. router.events.forEach((event) => {
      if(event instanceof NavigationStart) {
        if (event.navigationTrigger === 'popstate') {
          console.log(event, 'back button router');
        }
      }
    });
    Added inside constructor
3. @HostListener('window:popstate', ['$event'])
  onPopState(event) {
    this.router.navigate(
        ['search/']);
  }
  Inside the component

当我从外部页面返回并从/search/details/:id 页面单击浏览器返回按钮时，不会触发上述回调。但是，当我从/search/details/id 页面单击浏览器后退按钮而不转到外部页面时，上述回调被触发并被带到/search 页面。
因此，我认为在从外部重定向后重新加载 Angular 应用程序可以防止触发 popstate 事件。
任何想法/解决方案都受到高度赞赏。
谢谢

Answer 1

当你这样做 window.location.href = "https://www.payment.com";您关闭当前应用程序并打开新应用程序(payment.com 提供的应用程序)。
我认为完成您必须做的事情的一个好方法是创建一个内部带有 iframe 的新组件，并将其作为模式或弹出窗口打开。
可能你必须使用 DomSanitizer为 XSS 风险清理 url