node.js / angular.js – 无法获取

我有根路线，它工作正常。 我也有另一条路线127.0.0.1:3000/dashboard，如果我只是在地址栏中input该url我得到这个错误：

无法获取/仪表板

如果我创build一个链接到相同的url，它工作正常。

如果我然后刷新页面，我再次得到相同的错误。

下面是我的node.js路由

app.js

/** * Module dependencies. */ var express = require('express') , routes = require('./routes') , stats = require('./routes/stats') , tests = require('./routes/test') , http = require('http') , util = require('util') , path = require('path'); var app = module.exports = express(); app.configure(function(){ /* * Configuration * */ app.set('port', process.env.PORT || 3000); app.set('views', __dirname + '/views'); app.set('view engine', 'jade'); /* * Middleware definitions * */ app.use(express.favicon()); app.use(express.logger('dev')); /* * Error handling middleware */ app.use(express.bodyParser()); app.use(express.methodOverride()); app.use(express.cookieParser('shhhhhhhh, super secret')); app.use(app.router); // serves up dynamic css files app.use(require('stylus').middleware(__dirname + '/public')); app.use(require('less-middleware')({ src: __dirname + '/public' })); // serves a static path app.use(express.static(path.join(__dirname, 'public'))); }); app.configure('development', function(){ app.use(express.errorHandler({ dumpExceptions: true, showStack: true })); }); app.configure('production', function(){ app.use(express.errorHandler()); }); /* * Endpoints */ app.get('/', routes.index); app.get('/test', tests.get); app.post('/test', tests.post); app.options('/test', tests.options); app.get('/stats/sends', stats.sends.get); app.get('/stats/events', stats.events.get); app.get('/stats/attempts', stats.attempts.get); app.get('/stats/errors', stats.errors.get); app.get('/stats/mquad', stats.mquad.get); app.get('/partials/:name', routes.partials); app.get('/index/landing', routes.landing); app.get('/index/dashboard', routes.dashboard); console.log('Env: ' + app.settings.env); http.createServer(app).listen(app.get('port'), function(){ console.log("Express server listening on port " + app.get('port')); }); 

路线/ index.js

  exports.dashboard = function(req, res){ res.render('dashboard'); }; 

有angular度的路线

  'use strict'; angular.module('myApp', ['myApp.filters', 'myApp.services', 'myApp.directives']). config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) { $routeProvider. when('/', { templateUrl: 'partials/landing', controller: LandingCtrl }). when('/dashboard', { templateUrl: 'partials/dashboard', controller: DashboardCtrl }). otherwise({ redirectTo: '/' }); $locationProvider.html5Mode(true); }]); 

Answer 1

这是行不通的原因是你的服务器没有捕获所有其他的路由 ，并将它们路由到由routes.index服务的单页面应用程序。

为了捕获所有其他路线，并将它们路由到索引页面，以便您的angular度应用程序可以查看它是否匹配提供的url，所有您需要做的是在声明最后一个路由后添加以下行：

 app.get('*', routes.index); 

现在你应该能够：

• 直接导航到您的Angular.js应用程序提供的url
• 刷新任何页面没有错误

Answer 2

本文可能有所帮助：

http://jjt.io/2013/11/16/angular-html5mode-using-yeoman-generator-angular/

简而言之：

 npm install --save-dev connect-modrewrite 

Gruntfile：

 connect: { options: { // ... // Modrewrite rule, connect.static(path) for each path in target's base middleware: function (connect, options) { var optBase = (typeof options.base === 'string') ? [options.base] : options.base; return [require('connect-modrewrite')(['!(\\..+)$ / [L]'])].concat( optBase.map(function(path){ return connect.static(path); })); } } } 

Answer 3

路线app.get('/index/dashboard', routes.dashboard); 指的是http://hostname/index/dashboard而when('/dashboard', { ... })指向http://hostname/dashboard 。

你应该改正路线： app.get('/dashboard', routes.dashboard);

Answer 4

我会build议在前端和后端一个相当快的JavaScript解决scheme。

的NodeJS

 // set up our one route to the index.html file app.get('*', function (req, res){ res.sendFile(path.join(__dirname+'/public/index.html')); }); 

这个代码告诉de本地/远程服务器在哪里是主html，所以它可以find其余的模板。

AngularJs

 // If 404 Redirect to home $routeProvider.otherwise( { redirectTo: '/'} ); 

这也是非常有用的，所以永远不要失踪的页面。