将 node.js 服务器和 Angular 应用程序部署到 azure Web 服务答案

【问题标题】：Deploy node.js server and angular app to azure web service将 node.js 服务器和 Angular 应用程序部署到 azure Web 服务
【发布时间】：2020-08-12 14:58:36
【问题描述】：

我有一个 Angular 应用程序 (9.1.4) 和一个 node.js 服务器应用程序 (12.14.1)。我的文件当前配置如下：

MyApp
- package.json
- angular.json
- server
  - server.js
- src
  - app
  - asserts
  - environments
  - angular html/css/ts
- node_modules

为了在本地运行他，我必须在一个 cmd 提示符下运行 node server.js，在另一个提示符下运行 ng serve。我希望将此项目部署到 Azure，但不知道如何设置它以便它可以在单个应用程序服务中运行。所以：

如何在本地通过相同的命令运行服务器 (node.js) 和应用程序 (angular)？
在本地完成此设置后，需要更改哪些（如果有的话）才能在 Azure 中运行？

【问题讨论】：

您的问题解决了吗？有进展吗？

标签： node.js angular azure azure-web-app-service

【解决方案1】：

首先，你项目的启动端口，前端的angular项目和后端的node服务在同一个配置文件里吗？

如果是，那么您可以通过修改package.json 文件中的脚本来execute multiple commands。
因为 azure Web 应用仅支持 443 和 80 端口。如果两个项目的端口配置不一样，可以在本地正常运行。

例如ng项目为7001，服务端项目为7002，部署到azure web app，根据process.env.PORT参数，会出现端口冲突，项目无法启动。

那么如果是第二种情况，该如何处理：

您可以使用虚拟应用程序单独部署您的应用程序。更多详情，您可以see my answer in another post。

【讨论】：

这很有帮助！我现在在本地运行多个命令并同时启动服务器和应用程序。但是如何在我的 azure Web 应用程序中执行此操作？如何设置此启动命令？我使用 FTP 部署 Angular 应用程序，但服务器似乎没有运行，因为我无法访问任何 API。我认为这可能与端口有关？我现在只是将它硬编码为 3000，这不是您上面提到的端口。我该如何配置？
@alanafrankly 您可以使用npx serve -s 在门户中添加启动命令。
@alanafrankly 我的意思是，虽然你的项目分为前端和后端，但是在你的编码中还是需要用到的，比如app.set('port', process.env.PORT || 3000); ，后端设置为app.set('port', process.env.PORT || 3001);，而443和80，都是在azure运行，process.env.PORT默认值。
@alanafrankly 您不能硬编码配置端口值。只需将其设置为 app.set('port', process.env.PORT || 3000) 即可。
@alanafrankly 你用过虚拟应用吗？