如何在同一端口中运行 Angular 和 Node.JS Express？

这可能是重复的问题，但无法理解如何配置 FE 和 BE 一起运行它们。

我已经经历过this https://stackoverflow.com/q/39845526 and this https://stackoverflow.com/q/46782456提出疑问，但无法理解。

我的 Node+Express 在 4300 上运行

app.post('/postData', function(req, res) {
//some worst logics here :)
});

And

Angular 5 在 4200 上运行。下面是我调用 post 端点的 FE 服务

postData(feData) {
        console.log(feData);
        this.http.post('/postData', feData, this.httpHeader).subscribe((data) => {
        });
    }

我尝试的是打开两个cmd Windows：一个运行server.js by node server.js另一种是 ng 服务。

Result:

404 not fount(cannot post)

我究竟做错了什么。

在这种情况下，您需要做的是将 Angular 5 应用程序移至快速进程下运行。您可以按照以下步骤实现此目的tutorial https://www.djamware.com/post/5a0673c880aca7739224ee21/mean-stack-angular-5-crud-web-application-example- 参见第 2 项

我消除了一些复杂性，但我真的建议您看一下本教程。

npm install --save express body-parser

创建一个文件来运行您的节点应用程序，例如server.js并添加以下代码：

var app = require('app.js');
var debug = require('debug')('mean-app:server');
var http = require('http');

var port = normalizePort(process.env.PORT || '4300');
app.set('port', port);

var server = http.createServer(app);
server.listen(port);
server.on('listening', onListening);

function onListening() {
  var addr = server.address();
  debug('Listening on ' + port);
}

编辑“package.json”以指定应用程序的启动方式：

"scripts": {
  "ng": "ng",
  "start": "ng build && node server.js",
  "build": "ng build",
  "test": "ng test",
  "lint": "ng lint",
  "e2e": "ng e2e"
},

现在，创建将运行express的app.js：

var express = require('express');
var path = require('path');
var bodyParser = require('body-parser');

var sample = require('./routes/sample.js');
var app = express();

app.use(bodyParser.json());
app.use(bodyParser.urlencoded({'extended':'false'}));

//Put your angular dist folder here
app.use(express.static(path.join(__dirname, 'dist')));
app.use('/samples', express.static(path.join(__dirname, 'dist')));
app.use('/sample', sample);

module.exports = app;

为元素创建路径文件夹是一个很好的做法。创建文件routes/sample.js包含以下内容：

var express = require('express');
var router = express.Router();

router.get('/', function(req, res, next) {
  res.send('RESTful API');
});

module.exports = router;

使用节点命令运行服务器：

npm start