angular - 部署在 tomcat 服务器上的 angular(v4+) 刷新时出现 404 错误

Question

我已经部署了一个带有延迟加载的 Angular 应用程序。当托管在 Github.io 域上时，该应用程序可以完美运行，但是当我使用 mobaxterm 将应用程序部署到 tomcat 服务器上时出现错误。当页面重新加载或刷新时，应用会丢失路由状态并引发 404 错误。

HTTP 状态 404 -/查询

类型状态报告

留言/询价

描述请求的资源不可用。

Apache Tomcat/7.0.72

控制台日志::GET http://appv2.proctur.com/enquiry/addEnquiry 404(未找到)导航至 http://appv2.proctur.com/enquiry/addEnquiry

如果我不刷新页面并一次性使用该应用程序，那没关系，只是无法理解刷新时的问题。

PS::这是我第一次在 tomcat 服务器上托管 Angular 应用程序，如果我犯了任何愚蠢的错误，请告诉我。

为了更好地说明，我在懒加载模块的地方添加了 routing.module.ts。这是导入到 app.module.ts::

import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router';

@NgModule({
imports: [
    RouterModule.forRoot([
        { path: '', redirectTo: '/authPage', pathMatch: 'full' },
        { path: 'authPage', loadChildren: 'app/components/auth-page/auth-page.module#AuthPageModule' },
        { path: 'course', loadChildren: 'app/components/course/course.module#CourseModule' },
        { path: 'enquiry', loadChildren: 'app/components/enquiry/enquiry.module#EnquiryModule' },
        { path: 'student', loadChildren: 'app/components/students/student.module#StudentModule' },
    ])
],
exports: [
    RouterModule
]
})
export class AppRoutingModule {
}

Answer 1

当 Angular 应用加载时，首次 url 将从服务器提供。当您浏览页面时，它会在客户端处理。当您刷新页面时，请求将转到服务器(tomcat 或节点)。但该路由 url 在服务器上不存在。然后是 404 错误。你可以通过 HashLocationStrategy 解析，在路由配置中添加 {useHash: true} 对象即。

RouterModule.forRoot(routes, {useHash: true})

更多详情:- https://codecraft.tv/courses/angular/routing/routing-strategies/#_hashlocationstrategy