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操作 数据变化 逻辑及其复杂 <---- 状态对应内容(自动变化) 特点: - 简单 ...
随机推荐
- [Python]conda与 virtualenv虚拟环境配置
参考: Anaconda使用总结 Anacodna之conda与 virtualenv对比使用教程,创建虚拟环境 conda设置Python虚拟环境 python的virtualenv环境与使用 有时 ...
- 3D游戏开发之UE4中的集合:TSet容器
好久没有更新了,最近一直在老家过年,网络不通的,今天才有时间更新一集. 一.TSet<T>是什么 UE4中,除了TArray动态数组外,还提供了各种各样的模板容器.这一节,我们就介绍集合容 ...
- iOS 11开发教程(十三)iOS11应用编辑界面添加视图
iOS 11开发教程(十三)iOS11应用编辑界面添加视图 在iOS中添加视图的方式有两种:一种是使用编辑界面添加视图:另一种是使用代码添加视图.以下是这两个方式的详细介绍. 1.编辑界面添加视图 使 ...
- zk节点扩充
zk节点扩充,从3个节点扩充为7个节点,需要先安装4个节点,在将4个节点的配置进行修改,然后在修改 原有的3个节点.至此完成对zk的扩充实现,在此做个记录. zk节点的顺序,与对应zk与所在序列保持一 ...
- 3143 二叉树的序遍历codevs
题目描述 Description 求一棵二叉树的前序遍历,中序遍历和后序遍历 输入描述 Input Description 第一行一个整数n,表示这棵树的节点个数. 接下来n行每行2个整数L和R.第i ...
- BZOJ.3998.[TJOI2015]弦论(后缀自动机)
题目链接 \(Description\) 给定字符串S,求其第K小子串.(若T=0,不同位置的相同子串算1个:否则算作多个) \(Solution\) 建SAM,处理出对于每个节点,它和它的所有后继包 ...
- CCCC 成都信息工程大学游记
晚上刷智障25人本,刷到深夜四点,然后迷迷糊糊8点钟起床上车睡觉,然后就到了信息工程大学. 然后开始抢衣服,抢完衣服就开始拍照. 对了,这个学校看了下地图,好小呀,不过妹子好多呀. 然后就被老师带进机 ...
- SQL Server Management Studio 教程二: 创建新登录名
1.先用windows身份登录SQL server2008 2.打开[安全性],右击[登录名],选择[新建登录名] 3.[常规]选项页面中,修改如下位置设置,默认数据库可以是其他数据库,不一定是mas ...
- 使用Google-Colab训练PyTorch神经网络
Colaboratory 是免费的 Jupyter 笔记本环境,不需要进行任何设置就可以使用,并且完全在云端运行.关键是还有免费的GPU可以使用!用Colab训练PyTorch神经网络步骤如下: 1: ...
- HDU 4123 Bob’s Race(树形DP,rmq)
Bob’s Race Time Limit: 5000/2000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others)Total ...