如何將我的angular2模板鏈接到節點js express backend

Question

我嘗試連接後端（NodeJS，Express）和Frontend（Angular 2），但我不知道如何啓動。任何人都可以幫助我如何將後端鏈接到前端，如果有需要執行的配置或代碼，我必須執行。

Answer 1

使用Angular CLI項目。 執行 ng build --prod --base-href。生成dist文件夾。

現在通過節點JS服務此文件夾下面是將爲dist fodler服務的代碼片段。

// Get dependencies 
const express = require('express'); 
const path = require('path'); 
const http = require('http'); 
const bodyParser = require('body-parser'); 

// Get our API routes 
const api = require('./server/routes/api'); 

const app = express(); 

// Parsers for POST data 
app.use(bodyParser.json()); 
app.use(bodyParser.urlencoded({ extended: false })); 

// Point static path to dist 
app.use(express.static(path.join(__dirname, 'dist'))); 

// Set our api routes 
app.use('/api', api); 

// Catch all other routes and return the index file 
app.get('*', (req, res) => { 
    res.sendFile(path.join(__dirname, 'dist/index.html')); 
}); 

/** 
* Get port from environment and store in Express. 
*/ 
const port = process.env.PORT || '3000'; 
app.set('port', port); 

/** 
* Create HTTP server. 
*/ 
const server = http.createServer(app); 

/** 
* Listen on provided port, on all network interfaces. 
*/ 
server.listen(port,() => console.log(`API running on localhost:${port}`))