最近项目里面用到了React但是发布到iis站点之后,路由地址刷新访问直接404错误。查阅资料之后发现是iis缺少配置URL重写的问题导致的。下面我们来图形化配置，简单的配置下IIS

打开IIS使用 `Web平台安装程序`

搜索url关键字，您会看到

直接安装

关掉IIS 重新打开IIS在站点右边的控制面板可以看到一个URL重写的功能

新增配置如下

也可以直接使用我的配置

配置如下关键节点是：rewrite

<?xml version="1.0" encoding="UTF-8"?>
<configuration><system.webServer><rewrite><rules><rule name="ReactRouter" patternSyntax="ECMAScript" stopProcessing="true"><match url=".*" /><conditions><add input="{HTTP_METHOD}" pattern="^GET$" /><add input="{HTTP_ACCEPT}" pattern="^text/html" /><add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" /></conditions><action type="Rewrite" url="/index.html" /></rule></rules></rewrite></system.webServer>
</configuration>

附：其他http-server配置说明

Nginx

server {server_name react.yahui.wanglisten 80;root /wwwroot/ReactDemo/dist;index index.html;location / {try_files $uri /index.html;}
}

Tomcat

找到conf目录下的web.xml文件，然后加上一句话让他定位回来

<error-page><error-code>404</error-code><location>/index.html</location>
</error-page>

Apache

.htaccess文件配置如下

<IfModule mod_rewrite.c>RewriteEngine OnRewriteBase /RewriteRule ^index\.html$ - [L]RewriteCond %{REQUEST_FILENAME} !-fRewriteCond %{REQUEST_FILENAME} !-dRewriteCond %{REQUEST_FILENAME} !-lRewriteRule . /index.html [L]</IfModule>

转载请注明出处 http://blog.yahui.wang/2018/05/18/React-Router-browserHistory-IIS/

转载于:https://www.cnblogs.com/YahuiWang/p/React-Router-browserHistory-IIS.html

React 使用browserHistory项目访问404问题相关推荐

IDEA中导入项目运行失败提示Illeagle Arguement，访问404解决方法（Idea的Modules设置）
文章目录 IDEA中导入项目运行失败提示Illeagle Arguement,访问404解决方法(Idea的Modules设置) 起因尝试1:设置resources文件尝试2:啃代码尝试3:完全 ...
Tomcat无法启动和访问项目出现404
title: Tomcat无法启动和访问项目出现404 date: 2019-05-19 12:41:26 tags: ["Java", "Tomcat"] 首 ...
spring boot+mybatisplus集成后访问项目接口404
经检查发现,需要把启动类中@ComponentScan注解改为@MapperScan,之后重启项目访问正常
react-router browserHistory刷新页面404问题解决
2019独角兽企业重金招聘Python工程师标准>>> 使用React开发新项目时,遇见了刷新页面,直接访问二级或三级路由时,访问失败,出现404或资源加载异常的情况,本篇针对此问题 ...
react后台管理系统项目总结
React后台管理项目 1.创建一个项目 2.配置一个ui插件库开始实现跳转快速获取路由地址将路由和组件映射 axios请求实现登录模块隐藏二级路由按照价格排序或者按照销量等排序管理员 ...
react redux在项目中的使用
一开始我接触到redux是很懵的,看官方文档也很枯燥乏味,不理解说的什么意思,也是看过就忘,所以就结合公司的项目来熟悉一下redux.也可能有写的不对的地方,欢迎指出. 一.构建reducer 首先看 ...
php的VC9-VC14运行库分享以及localhost访问404问题
最近打开phpstudy,一直报错说缺少VC9的运行环境,所以就在网上找了一些运行库,在这里分享给大家. 一.为什么运行php环境需要VC9的运行库 php5.3.5.4和apache都是用vc9编译 ...
React+TS学习和使用（三）：React Redux和项目的路由配置
开启学习react+ts,本篇主要是学习使用React Redux和项目的路由配置一.React Redux 需求:使用TS+React Redux实现一个累加. A. 安装 $ yarn add ...
vue/react/web前端项目部署到阿里云服务器_nginx_pm2流程及部署前的准备
前端开发完成的项目,不管是使用vue.react.或者是别的web项目,最终都是要部署到外网上,让用户可以通过域名来访问.这篇文章以一个 react 移动端的项目为例,讲怎样将自己本地的项目部署到阿里 ...

React 使用browserHistory项目访问404问题

打开IIS使用 `Web平台安装程序`

关掉IIS 重新打开IIS在站点右边的控制面板可以看到一个URL重写的功能

也可以直接使用我的配置

附：其他http-server配置说明

Nginx

Tomcat

Apache

React 使用browserHistory项目访问404问题相关推荐

最新文章

热门文章

React 使用browserHistory项目访问404问题

打开IIS使用 Web平台安装程序

关掉IIS 重新打开IIS在站点右边的控制面板可以看到一个URL重写的功能

也可以直接 使用我的配置

附：其他http-server配置说明

Nginx

Tomcat

Apache

React 使用browserHistory项目访问404问题相关推荐

最新文章

热门文章

打开IIS使用 `Web平台安装程序`

也可以直接使用我的配置