如何在 IIS 上正确设置 ReactJS 应用程序？

Question

在同一个问题上浏览了几个主题。 None 为我工作。事情是：我有从 create-react-app 设计的 ReactJS + Redux 应用程序。实际上它有效但是当应用程序冲浪以 URL 不同于 root 开始时抛出 404。安装 iisnode 并尝试了网络中推荐的不同重写规则，但没有任何效果。最后是这个：

    <rule name="Redirect HTTP to HTTPS">
      <match url="(.*)" />
      <conditions>
        <add input="{HTTPS}" pattern="off" ignoreCase="true" />
      </conditions>
      <action type="Redirect" url="https://{HTTP_HOST}/{R:1}" redirectType="Permanent"/>
    </rule> -->

    <rule name="Redirect non-existent paths to root">
      <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="^/initialLogin/*" ignoreCase="true" negate="true" />            
      </conditions>
      <action type="Redirect" url="/" appendQueryString="false" />
    </rule>
  </rules>
</rewrite>

我唯一需要做的就是通过根 url 发送所有传入请求，并将其余地址传递给它，这样 SPA 才能正常工作。托管：AzureVM IIS: v10

编辑：另一个奇怪的事情是 iisnode 可以处理 js 文件的重定向，但是我的应用程序在 index.html 中呈现并且当我试图将 index.html 指向处理程序时它实际上显示了我是空白页。

Answer 1

这个 web.config 适合我。希望它能帮助别人。

<?xml version="1.0" encoding="UTF-8"?>
<configuration>
    <system.webServer>
        <!-- This part is responsible for URL rewrites -->
        <rewrite>
          <rules>
            <rule name="ReactJS 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="^/(api)" negate="true" />
              </conditions>
              <action type="Rewrite" url="/" />
            </rule>
          </rules>
        </rewrite>
        <!-- This allows CORS for testing purposes -->
        <httpProtocol>
         <customHeaders>
           <add name="Access-Control-Allow-Origin" value="*" />
         </customHeaders>
       </httpProtocol>
  </system.webServer>
</configuration>

如何在 IIS 上正确设置 ReactJS 应用程序？

How to set up ReactJS app on IIS properly?

iis

node.js

reactjs

iis-10