node.js - 平均值 : nodejs server for Angular App - How do i serve angular routes

Question

这是我的 Node server.js，它位于项目根目录中，具有自己的 npm 配置。所有 Angular 文件都在 /client 中，因此在 ng build 之后，dist 将位于 client/dist

const express = require('express');
const colors = require('colors');
const bodyParser = require('body-parser');
const path = require('path');
const cors = require('cors');

const PORT = process.env.port||'3200';

// init "app"
const app = express();

app.use(cors({origin: `http://localhost:4200`}));

// angular entry point
app.use(express.static(path.join(__dirname, 'client/dist')));

//parse incoming data before routes
app.use(bodyParser.json())

// api routes
app.use('/api',require('./api/api'));

// error middleware
app.use(function(err, req, res, next){
    console.log(`${err}`.red.bold)
    res.status(422).send({error: err.message });
});

// listen
app.listen(PORT, function(){
    console.log(`app running on ${PORT}...`.magenta);
});

当我访问服务器 http://localhost:3200/ 时，我看到了我的 Angular 应用程序。当我转到 http://localhost:3200/api/someExpressRoute 时，我得到了我的 api 函数。很好

现在我需要弄清楚如何提供 Angular 路线。例如 http://localhost:3200/about 是我的 Angular 单页应用程序的一部分。但是当我转到那个 url 时，服务器不知道该怎么做。

我如何配置此服务器以处理 http://localhost:3200/* 作为从索引提供的 Angular 路由？

Answer 1

下面是我如何通过 nodejs 服务我的 Angular 应用程序:

var express = require('express'),
   path = require('path'),
   fs = require('fs');
var compression = require('compression');
var app = express();
var staticRoot = __dirname + '/';
var env = process.env.NODE_ENV || 'development';

app.set('port', (process.env.PORT || 5000));

app.use(compression());
/* other middleware */

/* place any backend routes you have here */    

app.use(function(req, res, next) {
    //if the request is not html then move along
    var accept = req.accepts('html', 'json', 'xml');
    if (accept !== 'html') {
        return next();
    }

    // if the request has a '.' assume that it's for a file, move along
    var ext = path.extname(req.path);
    if (ext !== '') {
        return next();
    }

    fs.createReadStream(staticRoot + 'index.html').pipe(res);

});

app.use(express.static(staticRoot));

app.listen(app.get('port'), function() {
    console.log('app running on port', app.get('port'));
});

在为应用程序提供服务时，确保所有前端 dist 文件与此文件(我称之为 index.js)位于同一文件夹中