MEAN 应用程序设置不会将路由重定向到 Angular 应用程序答案

【问题标题】：MEAN application setup doesn't redirect routes to Angular applicationMEAN 应用程序设置不会将路由重定向到 Angular 应用程序
【发布时间】：2017-09-23 02:15:26
【问题描述】：

我正在尝试为 MEAN 应用程序设置基础。我使用 Angular CLI 创建了新项目，将 Express.js、MongoDB 模块添加到应用程序中。在app.js 文件中，我有以下配置：

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

var conf = require('./config/conf');
var server = require('http').Server(app);

var mongoDB = require('./adapters/mongodb')
var mongoClient = new mongoDB(conf);

app.use(bodyParser());

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

app.get('*', (req, res) => {
    res.sendFile(path.join(__dirname, 'dist/index.html'));
});

app.use(function (req, res, next) {
    res.setHeader('Access-Control-Allow-Origin', '*');
    res.setHeader('Access-Control-Allow-Methods', 'GET, POST, OPTIONS, PUT, PATCH, DELETE');
    res.setHeader('Access-Control-Allow-Headers', 'X-Requested-With,content-type,__setXHR_');
    res.setHeader('Access-Control-Allow-Credentials', true);
    next();
});

mongoClient.connect(function (dbconn) {
    app.dbconn = dbconn;
    app.conf = conf;
    console.log("************************************************************");
    console.log(new Date() + ' | CRUD Server Listening on ' + conf['web']['port']);
    console.log("************************************************************");
    server.listen(conf['web']['port']);
    var Routes = require('./routes/http-routes');
    new Routes(app);
});

我现在设置了一个 hello world 路由，并且没有对 Angular 源进行任何更改，这意味着我将登陆 Angular 默认起始页面。但我不能登陆页面，而是一个白屏页面。但是，我可以使用 Postman 访问路线。我先ng build 然后node app.js 运行应用程序。我做错了什么？

【问题讨论】：

你能显示路由的角度代码吗，当你得到一个空白页面时，你还应该看看控制台中的错误，还有你为什么把你的路由放到数据库连接中？有一种 Express 方式来处理路线

标签： angularjs node.js mean-stack

【解决方案1】：

你应该使用 Express 方式来处理路由

第一

const router=express.Router();

那么假设您有一个仅使用身份验证路由的文件

const authentication = require('./routes/authentication')(router);

总结，你只需要：

app.use('/authentication', authentication);

这样可以更好地划分路线

你会以这种方式使用你的路线

module.exports= (router)=>{

router.get('/',(req,res)=>{
res.json(message:'Hello World');
});

return router;

要设置角度路线，您需要路由器模块，更多详细信息请阅读documentation

【讨论】：

【解决方案2】：

您只从 Angular 应用程序中提供 index.html。但是您还需要提供资产、css 和 javascript。最简单的是这样的（但您需要调整目录名称：

app.use('/js', express.static(path.resolve(__dirname, 'dist/js')));
app.use('/css', express.static(path.resolve(__dirname, 'dist/css')));
app.use('/assets', express.static(path.resolve(__dirname, 'dist/assets')));

【讨论】：