javascript - Express 4 + Angular 2 HTML 5 路由问题

Question

我正在使用 Express 4 和 Angular 2 制作一个基本的网络应用程序。在这里，除了我使用的是 Angular 2 的 HTML 5 路由器之外，没有任何特定于 Angular 2 的东西。

这是应用程序的路由工作流程:

应用程序有两个主要的服务器端路由配置。两者看起来都类似于:

/* GET home page. */
router.get('/', authenticationHelpers.isAuth, function(req, res, next) {
  res.render('index');
});

/* GET login page. */
router.get('/login', authenticationHelpers.isNotAuth, function(req, res, next) {
  res.render('login');
});

这些明确地管理了用户路由到 / 和 /login 的两种情况。

但是，如果用户已登录并且能够访问 / 以呈现索引 express View ，则用户可以利用 HTML5 路由。这些包括如下 url:

localhost:5000/user
localhost:5000/profile
localhost:5000/profile/settings

问题

显然没有 router.get('/user')，也不应该有，因为这是 Angular 2 路由器完成的所有前端工作。但是，要启用允许用户简单地键入 localhost:5000/profile/settings 的链接，并让站点将您路由到索引文件(假设您已登录)然后路由您(使用 Angular 2 的 HTML 5 路由)到您自己的 /profile/settings我不得不将这段代码放在我的 app.js 中:

app.all("/*", function(req, res, next) {
  res.render('index');
});

不过这给了我一个大问题。如果您没有登录并且给您链接 localhost:5000/profile/settings 它将呈现索引 View ，因为它只运行 authenticationHelpers.isAuth 函数router.get('/') 上面的路由代码。我也希望能够在 express 或 angular 中不存在的路由上抛出 404 错误。

但是在我看来，要启用此功能，express 必须了解所有 HTML 5 路由选项以及 express 路由选项。对我来说，这打破了路由问题的分离，因为如果我更改了 HTML 5 Angular 路由，我还必须在 express 中进行更改(最有可能的是，查看下面的解决方案)。我想要所有这些功能，但如果这些信息不会在路由处理程序之间泄漏，但我根本看不到解决它的方法。如果有人可以帮助我找出更好的方法来做到这一点，那就太好了!如果信息共享或具有快速路线的 Angular 路线是我开发最优化的精益解决方案的唯一方式，我可以在下面:

可能的解决方案

router.get(['/', '/user/', '/profile/*'], authenticationHelpers.isAuth, function(req, res, next) {
  res.render('index');
});

Answer 1

将其添加到所有路由的末尾

app.all("/*", authenticationHelpers.isAuth, function(req, res, next) {
  res.render('index');
});

应该可以解决你的问题