react-router的browserHistory/react-router-dom的BrowserRouter刷新页面404问题解决
前端解决:
- '/' 表示把所有的url都发给代理https://api.example.com
- bypass 表示不需要发给发给代理服务器的条件
如下配置,可以监听https://api.example.com
域下的/
开头的请求(等效于所有请求),然后判断请求头中accept
字段是否包含html
,若包含,则代理请求至/index.html
,随后将返回index.html文档至浏览器。
proxy: {
'/': {
target: 'https://api.example.com',
secure: false,
bypass: function(req, res, proxyOptions) {
if (req.headers.accept.indexOf('html') !== -) {
console.log('Skipping proxy for browser request.');
return '/index.html';
}
}
}
}
django后端解决
对于所有后端不存在的url直接返回index.html文档给浏览器
handler404 = view.page_not_found # 强制刷新前端功能
def page_not_found(request, exception, template_name='index.html'):
return render(request, template_name)
参考:
http://blog.codingplayboy.com/2017/12/26/react-router-browserhistory-404/
react-router的browserHistory/react-router-dom的BrowserRouter刷新页面404问题解决的更多相关文章
- React学习(3)——Router路由的使用和页面跳转
React-Router的中文文档可以参照如下链接: http://react-guide.github.io/react-router-cn/docs/Introduction.html 文档中介绍 ...
- React 实践记录 03 React router
Introduction 本文主要参考了react router 的官方文档. React Router是一套完整的配合React的路由解决方案,可能你已经知道前端路由,或者知道后端有路由的概念,如下 ...
- 解决React路由URL中hash(#)部分的显示 、browserHistory打包后浏览器刷新页面出现404的问题
摘要 在React项目中,我们需要采用它的路由库React-Router来进行页面跳转,React会根据路由URL来判断是哪个页面.常见的的URL有两种显示方式,一种是hashHistory的形式,形 ...
- 从 0 到 1 实现 React 系列 —— 1.JSX 和 Virtual DOM
看源码一个痛处是会陷进理不顺主干的困局中,本系列文章在实现一个 (x)react 的同时理顺 React 框架的主干内容(JSX/虚拟DOM/组件/生命周期/diff算法/setState/ref/. ...
- React: 有状态组件生成真实DOM结点
上次我们分析了无状态组件生成 DOM 的过程,无状态组件其实就是纯函数,它不维护内部的状态,只是根据外部输入,输出一份视图数据.而今天我们介绍的有状态组件,它有内部的状态,因此在组件的内部,可以自行对 ...
- React: 无状态组件生成真实DOM结点
在上一篇文章中,我们总结并模拟了 JSX 生成真实 DOM 结点的过程,今天接着来介绍一下无状态组件的生成过程. 先以下面一段简单的代码举例: const Greeting = function ({ ...
- [React] 02 - Intro: why react and its design pattern
为啥使用React,给我个理由 过去 需要手动更新DOM.费力地记录每一个状态:既不具备扩展性,又很难加入新的功能,就算可以,也是有着冒着很大的风险. 不过,使用这种开发方式很难打造出极佳的用户体验. ...
- react基础学习和react服务端渲染框架next.js踩坑
说明 React作为Facebook 内部开发 Instagram 的项目中,是一个用来构建用户界面的优秀 JS 库,于 2013 年 5 月开源.作为前端的三大框架之一,React的应用可以说是非常 ...
- 【React】- 1、React介绍
React的开发背景 构建数据不断变化的大型应用 大量DOM操作 <---- 自动DOM操作 数据变化 逻辑及其复杂 <---- 状态对应内容(自动变化) 特点: - 简单 ...
随机推荐
- HDU4632 Poj2955 括号匹配 整数划分 P1880 [NOI1995]石子合并 区间DP总结
题意:给定一个字符串 输出回文子序列的个数 一个字符也算一个回文 很明显的区间dp 就是要往区间小的压缩! #include<bits/stdc++.h> using namesp ...
- 【noip模拟赛3】拣钱
描述 最近,Henry由于失恋(被某大牛甩掉!)心情很是郁闷.所以,他去了大牛家,寻求Michael大牛的帮助,让他尽快从失恋的痛苦中解脱出来.Michael大牛知道Henry是很爱钱的,所以他是费尽 ...
- 【Java】 大话数据结构(5) 线性表之双向链表
本文根据<大话数据结构>一书,实现了Java版的双向链表. 在每个数据结点中都有两个指针,分别指向直接后继和直接前驱,这样的链表称为双向链表. 双向链表的结构如图所示: 查找元素可以根据元 ...
- Django 2.1版本与Django 1.8.3的一些区别(转)
Django 2.1版本与Django 1.8.3的一些区别 我在刚开始学习的时候使用的Django版本是1.8.3的,后来在安装其它软件的时候,可能需要2.1的版本,自动帮我更新了Djang ...
- PLSQL Developer连接远程oracle配置
在windows机器上不想安装oracle或者oracle的客户端,我们怎么使用PLSQL Developer工具呢?答案如下: 环境 windows7 ...
- 006.KVM虚机克隆
一 KVM宿主机内克隆 1.1 查看虚拟机配置 [root@kvm-host ~]# cat /etc/libvirt/qemu/vm01-centos6.8.xml ………… [root@kvm-h ...
- ABP单元测试
一.介绍 在本文中,我将介绍如何为基于ASP.NET Boilerplate的项目创建单元测试. 我将使用本文开发的相同的应用程序(使用AngularJs,ASP.NET MVC,Web API和En ...
- Go面试题精编100题
Golang精编100题 选择题 1. [初级]下面属于关键字的是()A. funcB. defC. structD. class 参考答案:AC 2. [初级]定义一个包内全局字符串变量,下 ...
- 一个页面从输入 URL 到页面加载显示完成,这个过程中都发生了什么?
分为4个步骤: 1) 当发送一个 URL 请求时,不管这个 URL 是 Web 页面的 URL 还是 Web 页面上每个资源的 URL,浏览器都会开启一个线程来处理这个请求,同时在远程 DNS 服务 ...
- Jmeter自定义编写Java代码调用socket通信
一.前言 最近需要测试一款手机游戏的性能,找不到啥录制脚本的工具,然后,另外想办法.性能测试实际上就是对服务器的承载能力的测试,和各种类型的手机客户端没有啥多大关系,手机再好,服务器负载不了,也不能够 ...