angularjs - 将 ngRoute 与 Express 后端一起使用

Question

我已经阅读了关于这个主题的其他几个答案，但我不完全理解它是如何工作的。我有一个有 Angular 的前端。我正在尝试使用 $routeProvider 将部分加载到我的单页应用程序页面中。我收到 $routeProvider 请求的 404，我认为必须有一种方法可以设置它，而无需为服务器上的每个部分声明路由。很快就会有更多的部分，即使我现在在我的配置中只声明了一个。我的 routeProvider 代码如下所示:

myApp.config(['$routeProvider',
function ($routeProvider) {
    $routeProvider.
        when('/register', {
            templateUrl: 'partials/register',
            controller: 'registerCtrl'
        })
}])

但是转到 localhost:3000/register 会出现 404 错误。我查看了 SO 上的这个回复以及其他一些回复，但我无法将所有部分放在一起。

Express 4, NodeJS, AngularJS routing

上述帖子的解决方案如何

app.use('/*', function(req, res){
    res.sendfile(__dirname + '/public/index.html');
});

能够找到部分并将它们返回到前端(顺便说一句，这个片段对我不起作用)。

我的应用与使用 express 生成器创建新的 express 应用没有太大区别。我有这些与路由相关的 require 和 use 语句:

var routes = require('./routes/index');
var users = require('./routes/users');
app.use('/', routes);
app.use('/users', users);

这条路由在 routes/index 中为我的主页提供服务:

router.get('/', function(req, res, next) {
  res.render('home');
});

Answer 1

当您使用前端路由时，您不必为服务器上的每个部分声明一个路由。最简单的解决方案形式是让用户点击任何路由，并在后面使用通配符匹配，无论他们正在查看什么路由，您都只提供相同的前端应用程序模板。所以实际上你在很大程度上完全取消了后端路由。一旦您的 JS 启动并从导航栏中读取当前路线，它将解析适当的 View 。

查看其中一个教程，了解如何配置 Express 后端来处理此问题: http://fdietz.github.io/recipes-with-angular-js/backend-integration-with-node-express/implementing-client-side-routing.html

有一些细微差别，之前由于 SEO 之类的原因围绕这种结构存在争议，但其中很多已经被谷歌清除，现在能够解析 JS 并解析 SPA 中的 View (http://googlewebmastercentral.blogspot.com/2014/05/understanding-web-pages-better.html)

当然，你实际上会在后端有一些路由来接受 api 请求，但理想情况下就是这样，除非你选择花哨和同构，在后端预渲染 js 并提供完整的 View (尽管那是目前更适合 React，至少在 Angular 2.0 之前)