Azure Web应用程序的其他路径返回错误

Question

我使用create-react-app创建了一个React应用。我正在尝试将其部署在Azure Web应用程序上。我创建了一个构建并使用FTP进行了部署。

当从应用程序进行内部重定向时，我可以看到该网页。但是，当我尝试直接转到URL时，出现此错误。

例如：

如果基本网址是www.example.com，并且应用在内部重定向到/ new，则页面转到www.example.com/new。但是，如果我直接尝试加载www.example.com/new，则会收到上面显示的响应。在本地测试中不会发生这种情况

演示： 我在这里创建了一个演示

Answer 1

为了让它对我web.config有用，我在公共文件夹中添加了一个-file（这是favicon.ico, index.html&manifest.json所在的位置），并添加了以下代码：

<?xml version="1.0"?>
<configuration>
  <system.webServer>
    <rewrite>
      <rules>
        <rule name="React 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>
  </system.webServer>
</configuration>

我希望这可能会有所帮助:)

Answer 2

将以下文件放在目录web.config下/site/wwwroot

<?xml version="1.0"?>
<configuration>
  <system.webServer>
    <rewrite>
      <rules>
        <rule name="React 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>
  </system.webServer>
</configuration>

Answer 3

当有来自反应应用程序的内部重定向时，我可以看到网页。但是当我尝试直接访问该网址时，出现此错误。

The resource you are looking for has been removed, had its name changed, or is temporarily unavailable.

如果您使用网络工具捕获网络流量，当您单击“新建”按钮呈现（重定向到）新页面时，您会发现它只是在本地更改 URL，而不是真正向 http://data-trigger-mass-test.azurewebsites.net/new服务器请求。当你直接浏览并向 http://data-trigger-mass-test.azurewebsites.net/new服务器请求时，服务器找不到资源，因此返回（404）错误。为了使 URL http://data-trigger-mass-test.azurewebsites.net/new在服务器端和客户端都有效，您可能需要在服务器端和客户端都为其设置路由。