Angular 6 构建，刷新页面时未找到错误 404 [英] Angular 6 build, Error 404 Not Found when refresh page

问题描述

刷新页面时，我在生产版本中遇到404 页面未找到问题.使用 # 路由 RouterModule.forRoot(routes, { useHash: true }) 构建工作正常.但我想要一条没有 #

I have facing a problem 404 page not found in production build when refresh a page. Build working fine with # routing RouterModule.forRoot(routes, { useHash: true }). But I want a pretty route without #

我的模块看起来像

  @NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    FormsModule,
    HttpClientModule,
    CoreModule,
    AppRoutingModule,
    AuthModule
  ],
  providers: [
    {
      provide: HTTP_INTERCEPTORS,
      useClass: HttpInterceptorService,
      multi: true
    }
  ],
  bootstrap: [AppComponent]
})

推荐答案

页面刷新时显示 404 Not Found 的原因是所有 Angular 路由都应该通过 index.html 文件提供.

The reason why 404 Not Found is showing on page refresh is that all Angular routes should be served via the index.html file.

您可以通过添加包含以下内容的 .htaccess 文件(在 index.html 所在的同一目录中)来解决此问题.

You can fix this issue by adding a .htaccess file (in the same directory where the index.html resides) with the following contents.

<IfModule mod_rewrite.c>
  RewriteEngine On
  RewriteBase /
  RewriteRule ^index\.html$ - [L]
  RewriteCond %{REQUEST_FILENAME} !-f
  RewriteCond %{REQUEST_FILENAME} !-d
  RewriteRule . index.html [L]
</IfModule>

点击以下链接，了解有关将生产版本部署到 Apache 的更多详细信息:

Follow below link for further details regarding deploying production build to Apache:

https://github.com/mgechev/angular-seed/wiki/Deploying-prod-build-to-Apache-2

这篇关于Angular 6 构建，刷新页面时未找到错误 404的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！