显示文件结构而不是实际网页的应用服务 Web 应用

Posted 2023-02-19

【中文标题】显示文件结构而不是实际网页的应用服务 Web 应用

【英文标题】：App Service web app showing file structure instead of actual web apge

【发布时间】：2022-01-15 05:37:03

【问题描述】：

今天我已将我的客户端 React 应用部署到 Azure 应用服务。问题是，它不是显示我感兴趣的站点，而是返回 wwwroot 的结构。即使我将目录更改为 /src/App.js，它也会返回应用程序的代码。有什么问题？

【问题讨论】：

如果您点击 public/index.html 会发生什么？这是构建的 webapp 吗？

@azium 它的空白页。我通过“npm start”命令构建了 webapp

npm start 不会构建应用程序 npm run build 会。这将生成您托管网站所需的静态文件

@azium 我应该在哪里运行该命令？在 Kudu 控制台中？

从未听说过 kudu。你需要用那个吗？

【参考方案1】：

当您在 Windows Azure Web Apps 上运行节点应用程序时，IIS 与 iisnode 一起用作 Web 服务器，并且很可能某些配置有误，因此 IIS 不知道从什么开始。我建议让 Azure 处理 web.config 的创建，除非你知道自己在做什么，否则不要碰它：

创建一个文件.deployment，内容如下

[config]
SCM_DO_BUILD_DURING_DEPLOYMENT = true

将.deployment 文件以及你的 React 应用程序的内容放入（不要包含 web.config，你也不必包含 node_modules 文件夹，Azure 会处理这个因为 SCM_DO_BUILD_DURING_DEPLOYMENT 设置为 true) 到 upload.zip 文件中。

删除Azure中/wwwroot的内容

运行az webapp deployment source config-zip -g <ResourceGroupName> -n <AppServiceName> --src upload.zip

应该创建一个新的 web.config，其中应该包含 server.js 的处理程序，这将是 Node.js 提供的文件。

【参考方案2】：

解决了。感谢@azium

我唯一需要做的就是运行

npm run build

部署前在本地