Angular 2 - 使用隨機字符串設置基本href

我已經看到this post關於動態設置基本href，但它是爲每個客戶預先定義的基礎href。在我的情況下，我想在用戶訪問Web應用程序時生成一個隨機字符串作爲基礎href。例如：Angular 2 - 使用隨機字符串設置基本href

當訪問在瀏覽器http://localhost:4200，它重定向到：

當訪問http://localhost:4200/home，它也重定向到：

http://localhost:4200/ {random-string}/home

訪問http://localhost:4200/ {random-string}/home時，它應該照原樣放置。

瞭解，該基地的HREF可以這樣設置：

import { NgModule } from '@angular/core'; 
import { BrowserModule } from '@angular/platform-browser'; 
import { APP_BASE_HREF, Location } from '@angular/common'; 

import { AppComponent } from './'; 
import { getBaseLocation } from './shared/common-functions.util'; 

@NgModule({ 
    declarations: [AppComponent], 
    imports: [ 
    BrowserModule, 
    HttpModule, 
    ], 
    bootstrap: [AppComponent], 
    providers: [ 
    appRoutingProviders, 
    { 
     provide: APP_BASE_HREF, 
     useFactory: getBaseLocation, 
     deps: [MyService] // Updated based on @Yakov Fain's comment 
    }, 
    ] 
}) 
export class AppModule { }

{隨機字符串}應在getBaseLocation函數生成的，但我需要保存這個{隨機字符串}會話中以供將來使用，所以我的{隨機字符串}保存到被注射到getBaseLocation這樣的共享服務：訪問本地主機時

export function getBaseLocation(globalService: MyService) { 
    let paths: string[] = location.pathname.split('/').splice(1, 1); 
    if (paths && paths[0]) { 
     // path contains the appId 
     console.log("Existing appId: " + paths[0]); 
     // Save appId for future use 
     globalService.applicationId = paths[0]; 
    } else { 
     let newAppId = Math.random().toString(36).substr(2, 5); 
     // Save appId for future use 
     globalService.applicationId = newAppId; 
    } 

    let basePath = globalService.applicationId; 
    console.log("getBaseLocation : /" + basePath); 
    return '/' + basePath; 
}

它正常工作：4200被重定向到本地主機：4200/{隨機字符串} /家。但是，當點擊頁面上的另一個鏈接或僅刷新當前頁面時，我收到瀏覽器控制檯中的錯誤消息。的錯誤是這樣的：

GET http://localhost:4200/iun82/1.chunk.js 404（未找到）

ERROR錯誤：未捕獲（在承諾）：錯誤：裝載塊1失敗。

錯誤：加載塊1失敗。

請指教。謝謝！

來源

2017-05-29 Softhinker.com

如果你需要注入一個服務到出廠功能，請使用以下語法：

providers: [ 
    appRoutingProviders, 
    provide: MyService, 
    { 
     provide: APP_BASE_HREF, 
     useFactory: getBaseLocation, deps: [MyService] 
    }, 
    ]

來源

2017-05-29 20:56:08

感謝雅科夫！但是，當以這種方式實現時，我收到了「未處理的Promise拒絕：url.replace不是函數」：export function getBaseLocation（）{return（svc：MyService）：string => {return'/'+ randomStr; }} –

由於你正在向一個函數注入一個對象，所以它必須用一個參數來聲明，例如。 getBaseLocation（svc：MyService）{...} –

你是對的Yakov！然後我遇到了不同的錯誤。請參閱我上面更新的帖子。 –

Angular 2 - 使用隨機字符串設置基本href

回答

相關問題