React 路由 中 BrowserHistory 刷新报404

安装

react-router-dom 的安装 

npm install react-router-dom

常用的 history 有三种形式, 但是你也可以使用 React Router 实现自定义的 history。

在项目中最初开发阶段,使用的是hashHistory, 遇到的问题就是链接地址会有 #/

问题 

so 不得不使用BrowserHistory 这时候在开发环境中没有任何问题,刷新也不会报404

我的项目地址 http://react.cyclv.com/(个人项目)

但是项目打包之后,在服务器上跑的时候,在二级页面刷新时候会报404

推荐大家看一个介绍 http://react-guide.github.io/react-router-cn/docs/guides/basics/Histories.html

结论+解决方法:需要配置服务器信息,我的操作是把服务器端404转到自己的首页(index.html)

操作:更改404报错跳转页面的地址(这个是后端配置)

ErrorDocument 401 /error_pages/401.html
ErrorDocument 403 /error_pages/403.html
ErrorDocument 404 /index.html
ErrorDocument 500 /error_pages/500.html

这个时候页面刷新 依然会保存在当前页

分析原因:

1.在浏览输入链接到页面展示,期间做了什么

推荐大家百度,理解一下 本人推荐地址:https://www.jianshu.com/p/23b388f8e5aa

2.react项目目录

react,是单文件项目(本人自己项目打包之后)

也就是说当页面在http://react.cyclv.com/customerService

进行刷新时,是向服务请求customerService这个文件,因为就没有所有404

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值