我们有一个企业应用程序，客户端使用Angular 2。我们每个客户都有自己独特的网址，例如https://our.app.com/customer-one和https://our.app.com/customer-two。目前，我们可以设置< base href ...>动态使用document.location。所以用户点击https://our.app.com/customer-two和< base href ...>设置为/customer-two…perfect！
问题是如果用户例如在https://our.app.com/customer-two/another-page，并刷新该页面或尝试直接点击该网址，< base href ...>被设置为/ customer-two / another-page并且找不到资源。
我们尝试过以下操作无效：
<!doctype html>
<html>
<head>
<script type='text/javascript'>
var base = document.location.pathname.split('/')[1];
document.write('<base href="/' + base + '" />');
</script>
...
不幸的是，我们是新鲜的想法。任何帮助将是惊人的。
这是我们最后做的。
将其添加到index.html。应该是< head>中的第一件事部分
<base href="/">
<script>
(function() {
window['_app_base'] = '/' + window.location.pathname.split('/')[1];
})();
</script>
然后在app.module.ts文件中，添加{提供：APP_BASE_HREF，useValue：window [‘_ app_base’] || ‘/’}到提供者的列表，像这样：
import { NgModule,enableProdMode,provide } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { APP_BASE_HREF,Location } from '@angular/common';
import { AppComponent,routing,appRoutingProviders,environment } from './';
if (environment.production) {
enableProdMode();
}
@NgModule({
declarations: [AppComponent],imports: [
BrowserModule,HttpModule,routing],bootstrap: [AppComponent],providers: [
appRoutingProviders,{ provide: APP_BASE_HREF,useValue: window['_app_base'] || '/' },]
})
export class AppModule { }
