react 打包后,项目部署完毕,刷新页面报错(404)
原因解析:
之所以你在浏览器内可以由首页跳转到其他路由地址,是因为这是由前端自行渲染的,你在React Router定义了对应的路由,脚本并没有刷新网页访问后台,是JS动态更改了location。
当你刷新时,你首先是访问的后台地址,然后返回的页面内加载了React代码,最后在浏览器内执行;也就是说如果这个时候报404,是因为你后台并没有针对这个路由给出返回HTML内容,也谈不上执行React Router了。
解决方案一:
如果你期望所有的路由都由React Router来定义,只有你的后台,无论任何路径,都返回index.html就好了。剩下的事情交给React Router。那么你要做的就是修改后台服务器,可以放在apache,也可以放在你的java路由内做一个通配路径处理。
解决方案二:
关键点是要明白客户端路由和服务端路由的区别。服务端路由,不同的服务器配置的方式不同,楼主自己查。另外一种简单的解决方法,使用HashRouter,不要使用BrowserRouter,这样所有的请求都会定位到index.html这一个页面,服务器端也不需要任何配置了。
import {
BrowserRouter as Router,
Route,
Link
} from 'react-router-dom';
#改为
import {
HashRouter as Router,
Route,
Link
} from 'react-router-dom';
就是把 BrowserRouter改成HashRouter即可。

react 打包后,项目部署完毕,刷新页面报错(404)的更多相关文章
- angular4.0项目build发布后,刷新页面报错404
angular4.0项目执行npm run build后,进入页面正常显示. 但是当刷新页面时,报错404,页面未找到. 出现这个问题的原因,应该是找不到路由地址导致的,然后找到了下面的解决方案. 找 ...
- 解决Vue项目打包之后放到nginx下刷新就报错404的问题
最近跟着某机构的教学视频敲了一遍vue项目,但是在windows环境下部署的时候就懵逼了放到nginx下正常跑没问题,但是刷新之后就报404错误 前端项目构建vue 脚手架版本 是@vue/cli 4 ...
- 开启mode="history"模式,需要服务端的支持,因为出现“刷新页面报错404”的问题;
mode="history"是去除链接中的'#'的,但是加上后页面刷新回报404错误,怎么办呢? 解决办法:只需要在nginx中最末尾加上 try_files $uri $uri/ ...
- vue打包后刷新页面报错:Unexpected token <
前言 今天遇到了一个很怪的问题,在vue-cli+webpack的项目中,刷新特定页面后页面会变空白,报错为index.html文件中Unexpected token <. 怪点一是开发环境没有 ...
- React报错:Laravel React-Router browserHistory 刷新子页面报错404
举例:myblog.com/ 刷新没问题 myblog.com/add 刷新404 browserHistory报404,hashHistory却正常 原因是少路由.web.php添加路由 Route ...
- mave打包spring项目成jar,启动报错:Offending resource: URL [
文章目录 错误 解决 错误 Offending resource: URL [jar:file:/Users/leesin/intellij-idea-workspace/rabbitMq_Consu ...
- 前端vue项目部署到tomcat,一刷新报错404解决方法
公司前端写的后台部署到tomcat webapps目录下后,无法进行刷新,一刷新就会报错404,自动跳的404页面.在网上查了下,官方说是HTML5 History 模式引发的问题,但是解决方案中,并 ...
- vue2.0 项目build后资源文件报错404的解决方案
当vue项目build后,我们会看到css.js报错404的问题: 那我们就去找错误原因吧. 首先,查看build后的dist文件目录 可以看出,js.css在index.html的同级目录下: 然后 ...
- 新建SpringBoot项目运行页面报错Whitelabel Error Page This application has no explicit mapping for /error, so yo
新建SpringBoot项目运行页面报错Whitelabel Error Page This application has no explicit mapping for /error, so yo ...
随机推荐
- knockout 表单绑定 要怎么Mapping才好
问题 之前有了解过knockout,学习过绑定语法,结合帮助文档,做个Demo倒也不成问题,但是部分地方很不爽,不知道是我的用法不对,还是功力不够. 比如说,标签里定义的data-bind属性名,必须 ...
- hdu 1811(缩点+拓扑排序+并查集)
Rank of Tetris Time Limit: 1000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others)To ...
- 【原创】CMD命令设置IP地址
问题描述 在实际工作中,尤其是像我们这种BI分析人员,在做项目的时候,时常都需要因客户的不同随时切换不同的网络环境,有时可能需要在公司和客户之间来回的穿梭.交替.问题也就随之而来:每次客户那里都需要设 ...
- linq中转换类型报错
错误:LINQ to Entities 不识别方法“Int32 ToInt32(System.String)”,因此该方法无法转 上面报错是因为在Linq表达式中无法识别Convert和Parse方法 ...
- 一篇需要膜拜的文篇--Javascript异步编程模型进化(转)
要我能用得这么熟, 那前端出师了哈. http://foio.github.io/javascript-asyn-pattern/ 改天一个一个亲测一下. Javascript语言是单线程的,没有复杂 ...
- CDH-5.7.0:基于Parcels方式离线安装配置
http://shiyanjun.cn/archives/1728.html https://www.waitig.com/cdh%E5%AE%89%E8%A3%85.html
- [CTSC2016]时空旅行(线段树+凸包)
应该是比较套路的,但是要A掉仍然不容易. 下面理一下思路,思路清楚了也就不难写出来了. 0.显然y,z坐标是搞笑的,忽略即可. 1.如果x不变,那么直接set即可解决. 2.考虑一个空间和询问x0,通 ...
- [CP1804]最短路
题目大意: 一个$n(n\le10^5)$个点的图,给定一个常数$c$,每对点$i,j$之间有权值为$(i\oplus j)\times c$的边.另有$m(m\le5\times10^5)$条指定权 ...
- [LOJ6277]数列分块入门 1
题目大意: 给你一个长度为$n(n\leq 50000)$的序列$A$,支持进行以下两种操作: 1.将区间$[l,r]$中所有数加上$c$: 2.询问$A_r$的值.思路: 分块. 对于整块的数据打标 ...
- 单核时代,PHP之类多线程或者多进程的,是怎么处理并发的?是排队吗?
答案是:的确就是排队.但是并不是一定要处理完请求1才能去处理请求2:实际上请求的处理过程中,有很多的时间是耗在IO等其他地方,这时可以切换去处理其他请求,把等待的时间可以充分利用起来,达到更高的吞 ...