Angular 中的路由在刷新时抛出 404 资源不可用答案

【问题标题】：Route in Angular throws 404 resource not available when refreshedAngular 中的路由在刷新时抛出 404 资源不可用
【发布时间】：2021-02-05 14:26:45
【问题描述】：

我在使用ng build --prod --base-href=/myapp/ 构建的tomcat 中部署了我的角度应用程序，当我尝试使用[routerLink]="['/home'] 访问http://localhost:8083/myapp/home 之类的特定路线时，它工作正常，但是当尝试刷新页面或直接访问http://localhost:8083/myapp/home 时从浏览器，我得到HTTP Status 404 The requested resource [/myapp/home] is not available，下面是我的路由配置：

const routes: Routes = [
  { path: 'myapp', redirectTo: "/home", pathMatch: "full" },
  { path: 'home', component: HomeComponent }
];

更新：

我在tomcat中添加了以下配置，404错误消失了，但是现在当我刷新页面时，我被重定向到默认路由myapp，而我应该被重定向到当前路线：

<error-page> 
    <error-code>404</error-code>
    <location>/index.html</location>
</error-page>

【问题讨论】：

您需要配置 tomcat 以将所有请求（404 错误）重定向到 index.html，因为您的应用是单页应用
我该如何配置？
stackoverflow.com/a/47909980/3055401
是的，可以，但是当我在“家”以外的另一条路线中时，我刷新我被重定向到默认路线，即 myapp
不幸的是，我从未使用过 tomcat 来托管单页应用程序，所以我不知道如何解决这个问题。但我想你只需要对 tomcat 服务器进行“正确”配置

标签： angular tomcat routes web-deployment

【解决方案1】：

我通过将 index.html 中的 <base href="/"> 更改为 <base href="./"> 解决了这个问题

或直接在构建中指定 ./ ：

ng build --prod --base-href=./

【讨论】：