在 Azure 上部署 React 应用程序

Question

我正在尝试在 Azure 上部署我的 react 应用程序。这是一个我已经弹出的 create-react-app。我已经按照这篇文章进行了部署。我已将我的构建文件和 web.config 添加到我的站点/wwwroot 中。当我访问我的 webapp url 时，页面显示 “您无权查看此目录或页面。”

我在我的应用程序中使用客户端路由（react-router）。

这些是我的文件

web.config

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

这就是我的项目在 azure 上的样子

Answer 1

您需要转到应用程序设置并在虚拟应用程序中添加您的路径，如下所示：