Angular2 redirectTo導致在canActivate調用之前丟失URL參數

Question

我有一個canActivate Guard，它檢查jwt令牌的URL並將其保存為cookie（然后隨后將檢查cookie）。 如果沒有令牌，則將頁面重定向到另一個應用程序，該應用程序允許用戶登錄並創建jwt。

當我向后瀏覽時，我得到一個URL，例如：

http://localhost:3000/?jwt=...

AppModule執行以下操作：

RouterModule.forRoot([{path: "**", redirectTo: "/import", pathMatch: "full"}], {useHash: true})

然后在ImportModule ：

RouterModule.forChild([
            { path: "import", component: ImportComponent, canActivate: [ImportGuard] }
        ])

問題是我可以看到URL從localhost:3000/?jwt=...更改為localhost:3000/#/import ，並且參數丟失了，因此當我檢查它不存在時。

我是Angular2的新手，幾乎可以肯定做錯了什么，但是正在努力尋找有關如何從外部URL獲取參數的任何示例。

我無法更改外部服務以返回URL /#/import?jwt=...並且感覺不應該，因為當前實現已與ReactJS一起使用，所以我覺得Angular應該是可能的。

任何建議表示贊賞嗎？ 如果您需要更多信息，請告訴我。

謝謝

Answer 1

為什么不能在導入下使用子路由。 例如

  RouterModule.forChild([
     { path: "import", component: ImportComponent, canActivate:[ImportGuard],
     Children:[
             { path: "/:jwt", component: ImportComponent, canActivate: [ImportGuard]}] }
            ])

Answer 2

我偶然遇到了同樣的問題，即如何保留url參數並通過路由配置進行重定向。
要繞過此不受支持的操作，這可以幫助您：

export const routes: Routes = [
  {
    path: '',
    component: RedirectComponent,
    pathMatch: 'full'
  }
 }, [... your other routes config]
 ];

和RedirectComponent具有init：

this.router.navigate(['/import'], {relativeTo: this.route , preserveQueryParams : true});

Answer 3

我已通過以下操作解決了此問題

RouterModule.forRoot([{path: "**", component: AppComponent, pathMatch: "full"}], {useHash: true})

然后在AppComponent中，我使用document.URL來獲取URL並直接從字符串中獲取參數。 我不喜歡這種解決方案，因為它有點笨拙，寧願使用Route / Router。