5

我在 Angular 9 中为前端和 Node.js 作为后端服务器构建了一个项目。

现在我正在运行node appserver.js后端服务器。这默认侦听端口 9090。在另一个终端中，我ng serve像往常一样在端口 4200 上运行我的 Angular 应用程序。我在 Angular 应用程序中有一项服务，可以从服务器发送和接收消息。

我已经使用WebSocket类连接到端口 9090。我的应用程序在本地运行良好。但是现在我如何在 Heroku 中部署。Heroku 给出一个随机端口号，将指定为process.env.PORT. 如何在我的 WebSocket 服务中获取该端口？

我的问题是：

  1. 如何在 Heroku 中部署两台服务器？
  2. appserver.js 中的端口号如何在 Angular 的 WebSocket 服务中指定为端口号？
  3. 有没有使用 .env 文件和 ProcFile 来解决我的问题？
  4. Heroku中有没有使用multi-buildpack来解决我的问题？
4

1 回答 1

5

  1. 当它们都需要一个端口时，您不能部署两个单独的服务器。您必须将它们放入单独的应用程序中。在某些情况下，您可以组合 Web 服务器。部署服务器是正常的。

  2. 在 Heroku 上部署 Web 服务时，Heroku 为您提供了一个您必须绑定到的端口。然后，您可以在 下访问您的 Web 服务<appname>.herokuapp.com。（<- 这就是为什么 1.）要求您将它们放入单独的应用程序中。）。此外，当您连接到 Web 服务时，您只需提供 URL。该 URL 会自动翻译成<ipaddress>:<port>. 因此，在您的前端，您不会指定端口号。您在前端指定 websocket URL，没有任何端口。
    在您的 Web 服务器中，您绑定到process.env.PORT.

  3. .env 文件不应该被版本控制/提交。没用。如果您需要环境变量，您可以通过 Heroku 的仪表板进行设置。Procfile不是必需的，因为您使用的是 Node.js，它会查看npm start位于package.json. 但这并没有什么坏处，因为它提供了清晰性。

  4. 没有用于此的多构建包。

如果您的 2 台服务器严格区分并使用单独的协议。一种使用 http，另一种则可以将两台服务器捆绑为一台。这是一个例子：

const http = require('http');
const path = require('path');
const express = require('express');
const WSServer = require('ws').Server;
const DateFormat = require('dateformat');

let wss;
let server;
const app = express();
app.use(express.static(path.join(__dirname, './../build')));

server = new http.createServer(app);
wss = new WSServer({ server })

this.wss = wss;
wss.on('connection', function(socket) {
    console.log(DateFormat(new Date(), 'm/d h:MM:ss TT'),
        `client connected to server (${wss.clients.size} total)`);
    socket.on('message', function(data) {
        console.log(data)
    });
    socket.on('close', function(code, desc) {
        console.log(DateFormat(new Date(),
            "h:MM:ss TT"),'client disconnected, total:', wss.clients.length);
    });
});
wss.on('listening', () => console.log('Websocket listening on port', config.get('port')));
wss.on('error', err => console.log('Websocket server error:', err));

server.on('error', err => console.log('Server error:', err));
server.listen(process.env.PORT);

项目中的示例：
https ://github.com/vegeta897/d-zone/blob/63730fd7f44d2716a31fcae55990d83c84d5ffea/script/websock.js

部署

在该项目中，带有 websocket 服务器的后端被扩展为包括一个为静态文件提供服务的快速服务器。请注意，此更改仅存在于 heroku 分支中。

您将在此提交中找到使该项目 heroku 兼容的所有相关更改：
https ://github.com/vegeta897/d-zone/commit/63730fd7f44d2716a31fcae55990d83c84d5ffea

于 2020-04-29T10:15:01.173 回答