如何使用IIS设置react-router clean URL？

Question

React-Router使您的ReactJS应用程序可以通过简单的路由组件成为SPA.部署到IIS时,使用bashHistory进行设置时一切正常.但是,当我尝试使用browserHistory时,IIS正在尝试返回一个目录,而不是允许React-Router抓取并解析该路由.如何设置React-Router在IIS环境中工作？

Answer 1

让React-Router与IIS协同工作的关键是设置URL重写规则.在看了其他人如何使用IIS设置AngularJS SPA应用程序后,我提出了以下解决方案.

1. 在您的服务器上下载并安装URL Rewrite(开发和生产)

2. 设置规则以捕获任何不是文件和不是目录的URL路由.(可选)您可以否定要定期提供的任何实际目录.可以在Microsoft的文档中找到更多信息

   <?xml version="1.0" encoding="UTF-8"?> <configuration> <system.webServer> <rewrite> <rules> <rule name="ReactRouter Routes" stopProcessing="true"> <match url=".*" /> <conditions logicalGrouping="MatchAll"> <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" /> <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" /> <add input="{REQUEST_URI}" pattern="^/(docs)" negate="true" /> </conditions> <action type="Rewrite" url="index.html" /> </rule> </rules> </rewrite> </system.webServer> </configuration>

3. 在您的基本html页面(index.html)中<base/>,href向您的应用添加带有属性的标记.

   <base href='/path/to/my/app'/>