【Angular】——路由之刷新报404

项目进入测试期，发现了一个开发过程中没有发现的问题：发布后访问网站，使用过程一切正常：

但只要刷新，就会：

开始查了一些资料：大都是关于这样的说法：

那如果必须要这样解决的话，不就违背了前后端分离的原则？又开始让后端控制前端，这样前端自己封装路由又有何深刻的意义。因为有着这样的信念：肯定有前端的解决方案，所以继续查资料，最终发现了我想要的，在此分享给大家：

首先，我用的是tomcat发布、http://localhost:8080/vb/type是第一个页面，第一次跳转这个页面，一切正常，刷新，则报404。这是因为在界面出现后，浏览器则不再访问前端，除非有按钮等触发，所以刷新后浏览器不再走前端的路由，而是访问后端，而后端并没有定义该路由，所以找不到路径。这算是Angular的一个坑吧......

解决方案：

配置app.module.ts

在NgModule中添加：

    providers: [{ provide: LocationStrategy,useClass: HashLocationStrategy,}],如果你的服务也许在此，则：
    providers: [DataService,{ provide: LocationStrategy,另外需要引入：
    import {HashLocationStrategy,LocationStrategy} from '@angular/common';

    OK,这样设置后，访问Angular，会自动在根节点后面添加一个#锚点。在此刷新就不会报404错误了。

【Angular】——路由之刷新报404

相关文章