如何在一台服务器上部署Node.js API和Vue.js应用

Question

我已经开发了node rest api和vuejs Web应用程序， 我试图将两个项目部署到运行ubuntu的aws服务器中。 两种应用都有不同的端口， 域我尝试为api配置api.example.com，为vue应用配置example.com。 在SSH中运行命令后，我可以同时运行两个应用程序，但是我需要它们永久运行它。 我做了什么

1. 分别部署到应用程序
2. 应用程序可以通过端口访问

我需要他们访问

1. api.example.com
2. example.com

该怎么做， 任何更改主机文件。

Answer 1

这是我们在同一服务器上运行VueJS UI和ExpressJS REST API的方式。

我们正在通过PM2管理我们的服务。

VueJS（开发环境，您可以将相同的设置添加到生产环境中）

在.groupByKey(Serialized.with(...))中向package.json数组添加"start": "HOST='0.0.0.0' PORT=80 npm run dev",，其中VueJS正在监听的端口为80。然后，在安装PM2之后（对于开发人员），我们可以使用"scripts": {..}启动VueJS。 （确保Apache没有运行）。

请注意，将HOST设置为0.0.0.0非常重要。请勿将其设置为LocalHost或您的服务器IP地址，否则可能会遇到问题。

ExpressJS

在cd /location/of/vue/root; sudo pm2 start npm run dev --name Vue -- start中，类似于文件底部：/location/of/express/app.js，其中8081是REST API应该侦听的端口。然后，我可以使用 app.listen(process.env.PORT || 8081)

这时，VueJS应该可以从www.example.com（暗示端口80）获得，而REST API可以从www.example.com:8081获得。

如果要使api.example.com/指向API，则需要确保DNS将“ api”子域指向所需的端口，否则可能需要将该端口添加到URL中如上所述。

此外，您还可以使用sudo pm2 start /location/of/express/app.js --name Express轻松地通过PM2跟踪日志。

Answer 2

我发现了另一种在不使用PM的情况下在一台服务器上部署vue应用程序和express / nodejs的方法。这就是我所做的

1. 使用fun getTextResponse(responseJson: JSONObject): Array<String?> { val resultData = responseJson.getJSONArray("data") .getJSONObject(0) .getJSONArray("result") return Array<String?>(resultData.length()) { i -> resultData.getString(i) } } 命令构建您的vue代码。这将创建一个文件夹npm run build，该文件夹应具有dist文件和index.html文件夹。
2. 将static文件夹复制到服务器代码存储库中。就我而言，我创建了一个文件夹dist，并将public文件夹移到了dist内。

3. 在public行之前的app.js文件中，复制以下代码行

   module.exports=app

第一行确保//These 2 lines make sure that vue and express app are coming from the same server. app.use('/static', express.static(path.join(__dirname,"../public/dist/static/"))); app.get('/', function(req,res) { res.sendFile('index.html', { root: path.join(__dirname, '../public/dist/') }); });文件夹可访问，并且第二行将在运行节点服务器时为/static文件提供服务。 vue将注意组件之间的布线。