在ReactJS中为嵌套URL重写URL

编程问答 2022-08-15

问题描述

我正在IIS上运行react应用程序，我使用URL重写进行路由配置，这是我的web.config文件：

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

此代码适用于localhost / ReactApp / User等网址， 现在我希望它能像localhost / ReactApp / User / Edit一样工作，但不适用于子页面，它显示空白页面， 此问题仅在构建和部署之后出现，请让我知道它如何适用于/ User / Edit嵌套页面或Child页面？

解决方法

从子文件夹提供react应用时，您需要在溃败id(x)或

中设置基本名称

尝试以下iis网址重写规则：

<BrowserRouter basename='/path/to/subfolder/'>
iisiisreactjsreactjsurl-rewriting