如何在Microsoft IIS上使用react router(createBrowserHistory)来使路由工作？

Question

我正在使用react-router(createBrowserHistory)作为我的反应应用程序.

以下是我的代码

var ReactDOM = require('react-dom') ;

var ReactRouter = require('react-router');
var Router = ReactRouter.Router;
var Route = ReactRouter.Route;
var Link = ReactRouter.Link;
var browserHistory = require('react-router');
var createBrowserHistory = require('history/lib/createBrowserHistory');

var CL = require('./page1/1.jsx');
var Validation = require('./page3/3.jsx');
var Infos = require('./page4/4.jsx');
var Confirm = require('./page7/7.jsx');
var Upload = require('./page8/8.jsx');

module.exports = (

  <Router history={new createBrowserHistory()}> 
    <Route path='/' component={CL}></Route>                                                                                                                                     
    <Route path='/validation' component={Validation}></Route>                                                                                                                                     
    <Route path='/infos' component={Infos}></Route>                                                                                                                                     
    <Route path='/confirm' component={Confirm}></Route>                                                                                                                                     
    <Route path='/upload' component={Upload}></Route>                                                                                                                                     
  </Router>
)

Wen在本地运行IIS,我在浏览器上访问localhost,我可以获得"CL"组件并在页面上显示,但是,如果我去/验证,我会得到

Failed to load resource: the server respond with status of 404 (Not Found)

任何人都知道需要添加到IIS或我的js代码以使此路由工作？

Answer 1

我认为你在谈论反应路由器或类似的东西,配置在iis 7上适合我

<rules>
     <rule name="Rewrite Text Requests" 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>

Answer 2

我有点挣扎,所以我为下一个人写了:首先更新web.config文件(如Bo Chen所提到的).

 <system.webServer>
    <rewrite>
      <rules>
        <rule name="Rewrite Text Requests" 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>

这将找到每个请求并重写它/index.html.

所以你需要在项目的根目录中有一个index.html.另外要注意文件的扩展名.

Answer 3

您可以做两件事...

1. 添加虚拟路径以指向每条路线的水疗中心文件夹。
2. 使用 IIS URL 重写模块。这是对您使用 SO 应用程序的长时间讨论，因此这里有一篇描述它的文章 - http://weblogs.asp.net/owscott/rewrite-vs-redirect-what-s-the-difference