刷新後的白標籤錯誤頁面

Question

我有Spring Boot Application（後端），前端我使用的是Angular 2 Single Page Application。

每當我導航到一個路線，例如：localhost：8080/getAccounts，並做導航刷新後，我得到白色標籤錯誤頁面。如果我在根本地主機：8080我工作正常。該問題只發生在子鏈接中。

返回（使用返回/返回按鈕）到上一頁也工作正常。只是刷新。

我也不能直接調用鏈接：localhost：8080/getAccounts。首先，我必須回家（本地主機：8080）呼叫通過子導航欄的頁面。

有沒有人有同樣的問題？我不得不改變什麼樣的矛盾。我的代碼：

Main.ts

import {bootstrap} from '@angular/platform-browser-dynamic'; 
import {AppComponent} from './components/app.component'; 
import {HTTP_PROVIDERS}; 
import {enableProdMode} from '@angular/core'; 

enableProdMode(); 
bootstrap(AppComponent, [HTTP_PROVIDERS]); 

app.comonent：

import { Component, OnInit } from '@angular/core'; 

import { Http } from '@angular/http'; 
import { RouteConfig, ROUTER_DIRECTIVES, ROUTER_PROVIDERS } from '@angular/router-deprecated'; 

import { HomeComponent } from './home.component'; 
import { UserSearchComponent} from './webUserProfiles.component'; 
import { UserDetailViewComponent} from './webUserProfileView.component'; 

import { HTTPService } from '../service/http.service'; 


@Component({ 
    selector: 'app-content', 
    templateUrl: './app/templates/app.component.html', 
    directives: [ROUTER_DIRECTIVES, AccessErrorComponent], 
    providers: [ 
    ROUTER_PROVIDERS, 
    HTTPService 
    ] 
}) 

@RouteConfig([ 
    { 
    path: '/', 
    name: 'HomeComponent, 
    useAsDefault: true 
    }, 
    { 
    path: '/user', 
    name: 'UserSearch', 
    component: UserSearchComponent, 
    }, 
    { 
    path: '/user/:id', 
    name: 'UserDetailView', 
    component: UserDetailViewComponent, 
    } 
]) 

export class AppComponent implements OnInit { 
    constructor (
    ) { } 
} 
} 

在此先感謝

Answer 1

一些研究之後，我發現這個不錯的答案從Thierry Templier

使用默認策略（HTML5歷史API）的路由，您需要一個服務器配置來將所有路徑重定向到您的HTML入口點文件。隨着hashbang做法是沒有必要的。如果你想切換到這種方法，只需使用下面的代碼：

import { bootstrap } from "angular2/platform/browser"; 
import { provide } from "angular2/core"; 
import { 
    ROUTER_PROVIDERS, LocationStrategy, HashLocationStrategy 
} from "angular2/router"; 

bootstrap(MainApp, [ 
    ROUTER_PROVIDERS, 
    provide(LocationStrategy, {useClass:HashLocationStrategy}); 
]); 

你可以看看這個問題這些問題：

• When I refresh my website I get a 404. This is with Angular2 and firebase
• PathLocationStrategy vs HashLocationStrategy in web apps
• Is Angular 2's Router broken when using HTML5 routes?