Angularjs在Express 4.0后端API上进行路由
我已经开始使用Express 4.0服务器的应用程序。 我已经在很大程度上根据scotch.io( http://scotch.io/tutorials/javascript/build-a-restful-api-using-node-and-express-4 )上的教程设置了路线,build立了一个后端api服务于前端SPA(angularjs)。 这里是后端路由器的摘录:
router.route('/users') .get(function (req, res) { User.find(function(err, users) { if (err) { res.send(err); } else { res.json(users); } }); })
再向下
// home page route (http://localhost:8080) router.get('/', function(req, res) { res.send('API ROOT'); }); app.use('/api', router);
从前端我只使用get来从api获取用户:
$http.get('/api/users') .success(function(data) { $scope.users = data; });
而angular度路线是这样设置的:
.when('/', { templateUrl: 'views/home.html', controller: 'MainController' }) .when('/users', { templateUrl: 'views/user.html', controller: 'UserController' })
index.html有一个/ users的链接。
当启动服务器并goint进入localhost:8080时,它加载正常,点击用户加载user.html视图并列出用户。
但是,如果我点击刷新当浏览器在本地主机:8080 /用户
我得到:
Cannot get /users
这是一个控制器问题吗? 或者是后端路由问题?
任何意见/build议将非常欢迎!
search一下,我看到有几个解决scheme可以解决这个问题:无论是在前端(angular路由部分)添加到这个结尾:
// >>> redirect other routes to otherwise({ redirectTo: '/' });
或在后端(在所有路线之后):
app.get('*', function(req, res){ res.render('index.html'); });
哪种溶剂更好?(或者build议使用两种溶剂?)
你应该使用两者。
您需要为您的快速应用程序提供一个全部通配符/通配符路由,以便任何未明确匹配的路由将返回将加载Angular并允许您的Angular路由接pipe的索引页面。 请注意,这应该始终是您的最后路线(他们按顺序parsing)。
app.get('*', function(req, res){ res.render('index.html'); });
然后在你的Angular应用程序中,你应该有一个默认路由来捕获客户端的任何不匹配的路由。 如果应用程序已经加载,但是遇到未知路由,则此路由将生效,而上面的服务器端解决scheme将处理任何直接请求。
function($routeProvider) { $routeProvider. when('/', { templateUrl: 'home.html', controller: 'homeCtrl' }). otherwise({ redirectTo: '/' }); }]);