Angular ng-build后放入Tomcat,刷新404,手动输入404

本文介绍了解决Angular应用部署到Tomcat环境下刷新页面或手动输入URL时出现404错误的方法。提供了两种Angular内部配置方案,并推荐了一种通过修改Tomcat配置文件web.xml来实现404页面跳转的解决方案。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

最近因为一些要求,需要将angular打包放入tomcat和后台丢入同一个地址下,发布后,访问网站,过程都正常,单当刷新网页的时候,就出现404页面

同样,如果这个路由是你手动输入到浏览器的,也会跳转到404页面。

产生这样的原因,经过查资料也能发现,因为刷新页面、手动输入跳转寻找的都是 java web中的地址,自然是找不到的。

通过查询,看到的解决办法大致是两种:

1、

在NgModule中添加:   
providers: [{ provide: LocationStrategy, useClass: HashLocationStrategy, }],
    如果你的服务也许在此,则:
providers: [DataService, { provide: LocationStrategy, useClass: HashLocationStrategy, }],
    另外需要引入:

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

(引用:【Angular】——路由之刷新报404

2、
在app.moudule.ts中修改

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

(引用:Angular路由与导航

这两种的方法达到的都是一个效果,会在路由地址后面不上#,如图


有了#这个锚点之后,页面刷新就不会报404的错误,在一定程度上解决了问题,但是如果你是手动输入的路由,

那还会继续进入404页面。

因此,这个问题可能不能单单从angular出发解决。从师弟那学来了另一个方法,直接修改tomcat的web.xml配置

找到Tomcat安装路径中的conf,修改web.xml

加上404页面跳转处理:

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

</error-page>

让tomcat对404问题进行处理,跳转会/index.html,即回到前台路由中,这时候就会自动在前台路由中查询,不管是刷新

还是手动输入都能跳转到正确的位置。

如果还有其他解决办法,欢迎讨论


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值