Question

我正在使用React Router并将其放置在iis中，但是我注意到，当我从登录页面开始并经过所有路径时，它可以工作。如果我只输入路径网址，则会得到404。

我猜想这与服务器有关，不知道如何将其传递给我的客户路由？

我找到了this个帖子，但是我对答案有些困惑，因为有人说要更新web.config文件，但是我没有答案，因为它只是一个reactjs。

编辑

这就是我现在要重写的内容

当我尝试导航到不是索引页面的URL时，我得到的是白页。

当我查看控制台时。我明白了

Uncaught SyntaxError: Unexpected token <

转到main.js并抱怨此"<!DOCTYPE html>"，几乎就像我的index.html被合并到javascript文件中一样。

Answer 1

使React-Router与IIS配合使用的关键是设置URL重写规则。在研究了其他人如何使用IIS设置AngularJS SPA应用程序之后，我提出了以下解决方案。

在您的服务器上下载并安装URL Rewrite（开发和生产）

设置规则，用于捕获所有不是文件和目录的URL路由。（可选）您可以取消要定期提供的任何实际目录。可以在Microsoft's Documentation

上找到更多信息

<?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>

在基本html页面（index.html）中，将具有href属性的标签添加到您的应用中。

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

Answer 2

要扩展一点，您确实需要如Mohit解释的URL重写程序包，但不需要编写自己的web.config文件，可以直接从IIS管理器中完成。

一旦安装了URL Rewrite，您可能必须重新启动或重新启动IIS，您应该在网站的仪表板上看到它。我是在网站级别，而不是服务器级别。

您将在其中添加规则。它必须使用正则表达式与模式。*匹配请求URL的模式。这将匹配浏览器发送的所有网址。

在这种情况下，您将需要两个必须全部匹配的条件。您需要两个输入：

{REQUEST_FILENAME}不是文件
{REQUEST_FILENAME}不是目录

这些图案都不需要。

最后，在 Action 部分中，您需要 Rewrite ，其重写URL为/附加查询字符串。这将使所有内容都发送到react-router，而不会被服务器吸收。

这时，除非您还有其他不相关的业务逻辑也需要运行，否则您可能要停止处理更多规则。

这将配置IIS以将所有请求发送到站点的根目录，该目录应该是IIS中设置的默认文档之一，最有可能是index.html。从那里，React-router会捡起来。

React Router + IIS？如何启用路由

2 个答案: