在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解决方案的更多相关文章

  1. react ---- Router路由的使用和页面跳转

    React-Router的中文文档可以参照如下链接: http://react-guide.github.io/react-router-cn/docs/Introduction.html 首先,我们 ...

  2. jquery刷新iframe页面的方法

    1,reload 方法,该方法强迫浏览器刷新当前页面. 语法:location.reload([bForceGet]) 参数: bForceGet, 可选参数, 默认为 false,从客户端缓存里取当 ...

  3. jquery刷新iframe页面的方法(兼容主流)

    1,reload 方法,该方法强迫浏览器刷新当前页面.语法:location.reload([bForceGet])   参数: bForceGet, 可选参数, 默认为 false,从客户端缓存里取 ...

  4. JS怎么刷新当前页面

    JS怎么刷新当前页面 reload 方法,该方法强迫浏览器刷新当前页面.语法:location.reload([bForceGet]) 参数: bForceGet, 可选参数, 默认为 false,从 ...

  5. JS 怎么刷新当前页面

    reload 方法,该方法强迫浏览器刷新当前页面. 语法:location.reload([bForceGet]) 参数: bForceGet, 可选参数, 默认为 false,从客户端缓存里取当前页 ...

  6. 解决React路由URL中hash(#)部分的显示 、browserHistory打包后浏览器刷新页面出现404的问题

    摘要 在React项目中,我们需要采用它的路由库React-Router来进行页面跳转,React会根据路由URL来判断是哪个页面.常见的的URL有两种显示方式,一种是hashHistory的形式,形 ...

  7. tomcat 部署 React 项目后,浏览器刷新报404问题

    问题:tomcat部署了react前端项目,可以正常访问,但是页面刷新就报404 一.问题截图 二.解决办法 在tomcat 配置文件web.xml中配置如下代码: web.xml 路径: apach ...

  8. React+React Router+React-Transition-Group实现页面左右滑动+滚动位置记忆

    2018年12月17日更新: 修复在qq浏览器下执行pop跳转时页面错位问题 本文的代码已封装为npm包发布:react-slide-animation-router 在React Router中,想 ...

  9. Vue 部署单页应用,刷新页面 404/502 报错

    在 Vue 项目中,可以选择 hash或者 history.pushState() 实现路由跳转.如果在路由中使用history模式: export default new Router({ mode ...

随机推荐

  1. niceyoo的2020年终总结-2021年Flag

    碎碎念,向本命年说再见! 又到了一年一度立 Flag 的时间了,怎么样,去年的 Flag 大家实现的怎么样?还有信心立下 2021 年的 Flag 吗~ 今年我算比较背的,年初的一次小意外,直接在床上 ...

  2. Hadoop3.2.0+Centos7三节点完全分布式安装配置

    一.环境准备 ①准备三台虚拟机,配置静态IP ②先修改主机名(每个节点统一命名规范) vim /etc/hostname master #重启生效 配置DNS每个节点 vim /etc/hosts 1 ...

  3. 关于BackTop按钮的实现

    今天在处理,首页面的制作的时候,在实现backtop按键的时候,有些思路,作为记录. 功能为,点击backtop即可,立马跳到首页的最上面,且backtop只有在页面后1/2处才显示出来. 首先,我们 ...

  4. 基于Python的邮件检测工具

    邮件快速检测工具 概要介绍 mmpi,是一款使用python实现的开源邮件快速检测工具库,基于community框架设计开发.mmpi支持对邮件头.邮件正文.邮件附件的解析检测,并输出json检测报告 ...

  5. Java利用VLC开发简易视屏播放器

    1.环境配置 (1)下载VLC  VlC官网http://www.videolan.org/    各个版本的下载地址http://download.videolan.org/pub/videolan ...

  6. linux下hue的安装与部署

    一.Hue 简介 Hue是一个开源的Apache Hadoop UI系统,最早是由Cloudera Desktop演化而来,由Cloudera贡献给开源社区,它是基于Python Web框架Djang ...

  7. python实现域名注册查询

    author:摘繁华-蓝白社区 联合出品 域名生成与查询 文件说明: [x] .py源文件 [x] .exe可执行文件 [x] .config.json配置文件 ps: .exe和config.jso ...

  8. Apache下的配置文件httpd.conf、httpd-vhosts.conf 转

    Apache下的配置文件httpd.conf.httpd-vhosts.conf(windows) 2013-05-24 22:09 by youxin, 58 阅读, 0 评论, 收藏, 编辑 ht ...

  9. redhat_快捷键和shell命令操作.md

    tab键 命令自动补全 history !n 执行历史记录第n条 !! 执行上一条命令 !l 最后一条以l开头的命令 alias 创建命令的别名 alias 命令别名 = "命令行" ...

  10. 2021升级版微服务教程5—通过IDEA运行多个项目实例「模拟集群」

    2021升级版SpringCloud教程从入门到实战精通「H版&alibaba&链路追踪&日志&事务&锁」 教程全目录「含视频」:https://gitee.c ...