Question

我一直在研究一个相对简单的MEAN堆栈应用程序，现在想用Heroku来托管它。我90％的方式都在那里，但我似乎无法让状态/页面路由工作。如果有帮助，我正在使用Yeoman，Gulp和Bower。它当然在本地工作正常，但我找不到有关为Heroku指定路由器文件的信息。我有一种感觉，我可能会错过一个简单的“server.use（）”语句，但它也可能是我需要在package.json中进行的更改。我已经尝试在存储库中包含dist /文件夹，正如许多论坛对此问题的建议，无济于事。后端工作正常（除了使用mLab），因此至少在某种程度上正确配置了Heroku应用程序。

这是我的服务器：

// Modules
var gzippo = require("gzippo");
var express = require("express");
var server = express();
var bodyParser = require('body-parser');
var mongo = require('mongodb');
var mongoose = require('mongoose');

// Controllers and Services
var topic = require('./controllers/topic');
var auth = require('./controllers/auth');
var cors = require('./services/cors');

// Middleware
server.use(cors);
server.use(bodyParser.json());
server.use(server.router);
app.use(function(req, res) {
    // Use res.sendfile, as it streams instead of reading the file into memory.
    res.sendfile(__dirname + '/public/index.html');
});

server.get('/', topic.test);

server.get('/topic/:id', function(req, res, next) {
    res.id = req.params.id;
    next();
}, topic.get);

server.post('/topic/add', topic.post);

server.post('/topic/:id/:side/reason/add', function(req, res, next) {
    res.id = req.params.id;
    res.side = req.params.side;
    next();
}, topic.addReason);

server.get('/user/add', auth.add);

server.post('/user/login', auth.login);

// process.env.MONGOLAB_URI ||
// TODO: Protect mLab login credentials

// Mongo connection
mongoose.connect("<redacted>", function(err, db) {
    // mongoose.connect("mongodb://127.0.0.1:27017", function(err, db) {

    if (!err) {
        console.log("Connected to Mongo");
    } else {
        console.log("MONGO ERROR: " + err);
    }
})

// Server listener
server.listen(process.env.PORT || 4000, function() {
    server.use(express.static(__dirname));
    // server.use(gzippo.staticGzip("" + __dirname + "/dist"));
    console.log("Server listening on port " + process.env.PORT);
});

// server.listen(4000, function() {
//  console.log("Server listening on port 4000");
// });

的package.json：

{
  "name": "mystance",
  "version": "1.0.0",
  "description": "The world's opinions in three boxes.",
  "main": "/back-end/server.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "ng": "ng",
    "build": "cd front-end && gulp build",
    "postinstall": "cd front-end && bower install"
  },
  "repository": {
    "type": "git",
    "url": "git+https://github.com/connergillette/mystance.git"
  },
  "author": "Conner Gillette",
  "license": "MIT",
  "bugs": {
    "url": "https://github.com/connergillette/mystance/issues"
  },
  "homepage": "https://github.com/connergillette/mystance#readme",
  "engines": {
    "node": "6.10.3"
  },
  "dependencies": {
    "@angular/cli": "1.0.2",
    "@angular/common": "^4.0.0",
    "@angular/compiler": "^4.0.0",
    "@angular/compiler-cli": "^4.0.0",
    "@angular/core": "^4.0.0",
    "@angular/forms": "^4.0.0",
    "@angular/http": "^4.0.0",
    "@angular/platform-browser": "^4.0.0",
    "@angular/platform-browser-dynamic": "^4.0.0",
    "@angular/router": "^4.0.0",
    "angular-animate": "^1.6.5",
    "async": "^2.5.0",
    "babel-core": "~6.7.4",
    "babel-loader": "~6.2.4",
    "babel-preset-es2015": "~6.6.0",
    "body-parser": "^1.17.2",
    "bower": "^1.8.0",
    "browser-sync": "~2.9.11",
    "browser-sync-spa": "~1.0.3",
    "chalk": "~1.1.1",
    "del": "~2.0.2",
    "eslint-loader": "~1.1.0",
    "eslint-plugin-angular": "~0.12.0",
    "estraverse": "~4.1.0",
    "express": "^4.15.3",
    "gulp": "~3.9.0",
    "gulp-angular-templatecache": "~1.8.0",
    "gulp-autoprefixer": "~3.0.2",
    "gulp-cssnano": "~2.1.1",
    "gulp-eslint": "~1.0.0",
    "gulp-filter": "~3.0.1",
    "gulp-flatten": "~0.2.0",
    "gulp-htmlmin": "~1.3.0",
    "gulp-inject": "~3.0.0",
    "gulp-load-plugins": "~0.10.0",
    "gulp-protractor": "~2.1.0",
    "gulp-rename": "~1.2.2",
    "gulp-replace": "~0.5.4",
    "gulp-rev": "~6.0.1",
    "gulp-rev-replace": "~0.4.2",
    "gulp-sass": "~2.0.4",
    "gulp-size": "~2.0.0",
    "gulp-sourcemaps": "~1.6.0",
    "gulp-uglify": "~1.4.1",
    "gulp-useref": "~3.0.3",
    "gulp-util": "~3.0.6",
    "gzippo": "^0.2.0",
    "http-proxy-middleware": "~0.9.0",
    "jwt-simple": "^0.5.1",
    "karma": "~0.13.10",
    "karma-coverage": "~0.5.2",
    "karma-jasmine": "~0.3.6",
    "karma-ng-html2js-preprocessor": "~0.2.0",
    "karma-phantomjs-launcher": "~0.2.1",
    "karma-phantomjs-shim": "~1.2.0",
    "lodash": "~3.10.1",
    "main-bower-files": "~2.9.0",
    "moment": "^2.18.1",
    "mongoose": "^4.11.0",
    "ng-annotate-loader": "0.0.10",
    "phantomjs": "~1.9.18",
    "uglify-save-license": "~0.4.1",
    "webpack-stream": "~2.1.1",
    "wiredep": "~2.2.2",
    "yo": "^2.0.0"
  }
}

index.route.js：

export function routerConfig($stateProvider, $urlRouterProvider) {
    'ngInject';
    $stateProvider
        .state('home', {
            url: '/',
            templateUrl: 'app/main/main.html',
            controller: 'MainController',
            controllerAs: 'main'
        })

        .state('topic-add', {
            url: '/topic/add',
            templateUrl: 'app/topic/topic-add.html',
            controller: 'TopicController',
            controllerAs: 'topic'
        })

        .state('reason-add', {
            url: '/topic/:id/:side/reason/add',
            templateUrl: 'app/topic/reason-add.html',
            controller: 'TopicController',
            controllerAs: 'topic'
        })

        .state('topic', {
            url: '/topic/:id',
            templateUrl: 'app/topic/topic.html',
            controller: 'TopicController',
            controllerAs: 'topic'
        });

    $urlRouterProvider.otherwise('/');
}

我以前从未部署过NodeJS应用程序，如果我犯了一些（或很多）愚蠢的错误，请道歉。任何帮助表示赞赏。感谢。

Answer 1

请检查：https://github.com/heroku/node-js-getting-started

通常我们需要做的就是将以下内容添加到服务器js文件中：

app.set('port', (process.env.PORT || 5000));
pp.listen(app.get('port'), function() {
  console.log('Node app is running on port', app.get('port'));
});

Heroku中的外部文件中的角度路由

1 个答案: