Angular 2 : 404 error occur when I refresh through the browser

Question

这个问题在这里已经有了答案:





Angular 2.0 router not working on reloading the browser

(32 个回答)


4年前关闭。




我是 Angular 2 的新手。我将我的单页应用程序存储在我的服务器中名为“myapp”的文件夹中。我已将 base 中的 URL 更改为 http://example.com/myapp/` .
我的项目有两页。所以我实现了 Angular 2 路由。我将默认页面设置为登录。当我输入 http://example.com/myapp/在我的浏览器中，它会自动重定向到 http://example.com/myapp/login .但是如果刷新该页面，我会得到一个 404错误，说http://example.com/myapp/login没有找到。
但是，如果我使用 lite 服务器运行我的项目，则一切正常。在这种情况下，index.html 中的基本 URL 将是 "/" .怎么修？

Answer 1

更新 Angular 2 最终版 版本
在 app.module.ts 中:

添加进口:

  import { HashLocationStrategy, LocationStrategy } from '@angular/common';

在 NgModule 提供程序中，添加:

  {provide: LocationStrategy, useClass: HashLocationStrategy}

示例 (app.module.ts):

import { NgModule }       from '@angular/core';
import { BrowserModule  } from '@angular/platform-browser';
import { AppComponent }   from './app.component';
import { HashLocationStrategy, LocationStrategy } from '@angular/common';

@NgModule({
    declarations: [AppComponent],
    imports: [BrowserModule],
    providers: [{provide: LocationStrategy, useClass: HashLocationStrategy}],
    bootstrap: [AppComponent],
})
export class AppModule {}

选择
使用 RouterModule.forRoot 和 {useHash: true} 参数。
示例: (来自 angular docs)

import { NgModule } from '@angular/core';
...

const routes: Routes = [//routes in here];

@NgModule({
  imports: [
    BrowserModule,
    FormsModule,
    RouterModule.forRoot(routes, { useHash: true })
  ],
  bootstrap: [AppComponent]
})
export class AppModule { }