请求新页面时如何在Express（Node.js）中使用AngularJS路由？

Question

我正在使用Express，它从静态目录加载AngularJS。通常，我会要求http://localhost/Express为其提供我index.html和所有正确的Angular文件等。在我的Angular应用中，我有这些路由设置，它们替换了内容ng- view：

$routeProvider.when('/', {
    templateUrl: '/partials/main.html',
    controller: MainCtrl,
});

$routeProvider.when('/project/:projectId', {
    templateUrl: '/partials/project.html',
    controller: ProjectCtrl,
});

$locationProvider.html5Mode(true);

在我的主页上，我有到的链接<a href="/project/{{project.id}}">，该链接将成功加载模板并将我定向到http://localhost/project/3或指定的任何ID。问题是当我尝试将浏览器定向到http://localhost/project/3页面或刷新页面时，请求将发送到Express
/ Node服务器，该服务器返回Cannot GET /project/3。

我该如何设置我的Express路线来适应这一点？我猜想它将需要$location在Angular中使用（尽管我宁愿避免使用丑陋的？search和#hash），但是对于如何设置Express路由来处理此问题我一无所知。

谢谢。

Answer 1

我将创建一个包罗万象的处理程序，该处理程序 在 发送必要数据的常规路由 之后 运行。

app = express();
// your normal configuration like `app.use(express.bodyParser());` here
// ...
app.use(app.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');
});

app.router是运行您所有Express路由（例如app.get和app.post）的中间件；通常，Express会自动将其自动放置在中间件链的最末端，但您也可以像在此所做的那样将其显式添加到中间件链中。

然后，如果URL不是由处理的app.router，则最后一个中间件将把Angular HTML视图发送给客户端。对于其他中间件未处理的 任何
URL，都会发生这种情况，因此您的Angular应用将必须正确处理无效路由。