Question

以下组件是从我的React应用程序的App.js中加载的。

const Main = () => (
  <BrowserRouter>
    <Switch>
      <Route exact path="/:userid" component={Banks} />
    </Switch>
  </BrowserRouter>
);

使用本地开发服务器运行应用程序时，我可以从以下网址获取用户ID：

http://myAppPath/100

但是，当我构建应用程序并将其托管在IIS中时，我无法获得用户ID。

https://localhost/Bank/100->将HTTP更新为HTTPS

无法识别路由。我使用了URL Rewrite，但是userid的值仍然没有输入。

<system.webServer>
    <rewrite>
        <rules>
            <rule name="Routing" enabled="true" stopProcessing="true">
                <match url=".*" />
                <conditions>
                    <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
                    <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
                </conditions>
                <action type="Rewrite" url="/" logRewrittenUrl="true" />
            </rule>
        </rules>
    </rewrite>
</system.webServer>

index.html：

<!doctype html><html lang="en"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1,shrink-to-fit=no"><meta name="theme-color" content="#000000"><link rel="manifest" href="./manifest.json"><link rel="shortcut icon" href="./favicon.ico"><title>Bank App</title><link href="./static/css/main.b730bb13.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div><script type="text/javascript" src="./static/js/main.2564873f.js"></script></body></html>

Answer 1

首先从here在服务器上

安装iis url重写。那么只有它尊重您的url重写配置

更新

<?xml version="1.0" encoding="UTF-8"?>
<configuration>
  <system.webServer>
    <rewrite>
      <rules>
        <rule name="Static Assets" stopProcessing="true">
          <match url="([\S]+[.](html|htm|svg|js|css|png|gif|jpg|jpeg))" />
          <action type="Rewrite" url="/{R:1}"/>
        </rule>
        <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" />
          </conditions>
          <action type="Rewrite" url="/index.html" />
        </rule>
      </rules>
    </rewrite>
  </system.webServer>
</configuration>

如何在IIS中启用React路由？

1 个答案: