React-Router browserHistory浏览器刷新出现页面404解决方案
在React项目中我们经常需要采用React-Router来配置我们的页面路由,React-Router 是建立在 history 之上的,常见的history路由方案有三种形式,分别是:
1.hashHistory
2.browserHistory
3.createMemoryHistory
如果使用hashHistory ,访问的页面url如 example.com/#/some/path 的路由。
于是采用第二种browserHistory,但是部署到自己的服务器之后,可以正常访问,但是强制刷新页面之后报404找不到页面路径
Nginx配置方式如下
server {
server_name react.thinktxt.com;
listen 80;
root /Users/txBoy/WEB-Project/React-Demo/dist;
index index.html;
location / {
try_files $uri /index.html;
}
}
访问后刷新,解决404问题
React-Router browserHistory浏览器刷新出现页面404解决方案的更多相关文章
- react ---- Router路由的使用和页面跳转
React-Router的中文文档可以参照如下链接: http://react-guide.github.io/react-router-cn/docs/Introduction.html 首先,我们 ...
- jquery刷新iframe页面的方法
1,reload 方法,该方法强迫浏览器刷新当前页面. 语法:location.reload([bForceGet]) 参数: bForceGet, 可选参数, 默认为 false,从客户端缓存里取当 ...
- jquery刷新iframe页面的方法(兼容主流)
1,reload 方法,该方法强迫浏览器刷新当前页面.语法:location.reload([bForceGet]) 参数: bForceGet, 可选参数, 默认为 false,从客户端缓存里取 ...
- JS怎么刷新当前页面
JS怎么刷新当前页面 reload 方法,该方法强迫浏览器刷新当前页面.语法:location.reload([bForceGet]) 参数: bForceGet, 可选参数, 默认为 false,从 ...
- JS 怎么刷新当前页面
reload 方法,该方法强迫浏览器刷新当前页面. 语法:location.reload([bForceGet]) 参数: bForceGet, 可选参数, 默认为 false,从客户端缓存里取当前页 ...
- 解决React路由URL中hash(#)部分的显示 、browserHistory打包后浏览器刷新页面出现404的问题
摘要 在React项目中,我们需要采用它的路由库React-Router来进行页面跳转,React会根据路由URL来判断是哪个页面.常见的的URL有两种显示方式,一种是hashHistory的形式,形 ...
- tomcat 部署 React 项目后,浏览器刷新报404问题
问题:tomcat部署了react前端项目,可以正常访问,但是页面刷新就报404 一.问题截图 二.解决办法 在tomcat 配置文件web.xml中配置如下代码: web.xml 路径: apach ...
- React+React Router+React-Transition-Group实现页面左右滑动+滚动位置记忆
2018年12月17日更新: 修复在qq浏览器下执行pop跳转时页面错位问题 本文的代码已封装为npm包发布:react-slide-animation-router 在React Router中,想 ...
- Vue 部署单页应用,刷新页面 404/502 报错
在 Vue 项目中,可以选择 hash或者 history.pushState() 实现路由跳转.如果在路由中使用history模式: export default new Router({ mode ...
随机推荐
- SparkStreaming推测机制:面试被问遇到什么问题,说这个显水平!
背景 老刘最近晚上会刷刷牛客网的大数据开发面经,总是会看到一个高频的面试题,那就是你在学习过程中遇到过什么问题吗? 这个问题其实有点难回答,如果我说的太简单了,会不会让面试官觉得水平太低,那我应该讲什 ...
- 一个简单的springboot+mybatis-plus+thymeleaf的学生管理系统
一.登录功能 1.1登录所涉及的功能主要包括拦截器,过滤器,用户在未登录的时候,访问页面会阻止访问的,如图所示: 实现这个功能的主要代码如下所示 1 //拦截器 2 public class Logi ...
- Hbase相关参数详解
转载:http://www.cnblogs.com/nexiyi/p/hbase_config_94.html 版本:0.94-cdh4.2.1 hbase-site.xml配置 hbase.tmp. ...
- LeetCode 124 二叉树中最大路径和
题目: 给定一个非空二叉树,返回其最大路径和. 本题中,路径被定义为一条从树中任意节点出发,达到任意节点的序列.该路径至少包含一个节点,且不一定经过根节点. 思路:递归 分为三部分,根节点,左子树,右 ...
- k8s之API Server认证
集群安全性 在生产环境中,必须保障集群用户的角色以及权限问题,不能给所有用户都赋予管理员权限. 1.集群的安全性必须考虑如下几个目标 (1)保证容器与其所在宿主机的隔离 (2)限制容器给基础设置或其他 ...
- python+sklearn+kaggle机器学习
python+sklearn+kaggle机器学习 系列教程 0.kaggle 1. 初级线性回归模型机器学习过程 a. 提取数据 b.数据预处理 c.训练模型 d.根据数据预测 e.验证 今天是10 ...
- 通过DNSLOG回显验证漏洞
通过DNSLOG回显验证漏洞 前言 实际渗透测试中,有些漏洞因为没有回显导致无法准确判断漏洞是否存在,可能导致渗透测试人员浪费大量精力在一个并不存在的漏洞上,因此为了验证一些无回显漏洞,可结合DNSl ...
- 【Flutter】功能型组件之数据共享
前言 InheritedWidget提供了一种数据在widget树中从上到下传递.共享的方式,例如在应用的根widget中通过InheritedWidget共享了一个数据,那么便可以在子widge ...
- 【Flutter】可滚动组件之SingleChildScrollView
前言 SingleChildScrollView类似于Android中的ScrollView,它只能接收一个子组件. 接口描述 const SingleChildScrollView({ Key ke ...
- Linux学习笔记 | 配置ssh
目录: SSH的必要性 将默认镜像源修改为清华镜像源 Linux安装ssh软件 使用putty软件实现ssh连接 Windows下安装winscp SSH的必要性 一般服务器都位于远程而非本地,或者及 ...