使用 / 和 /:slug 表示动态路由作为不同的路由文件



所以我正在重构我的节点/快速应用程序,我正在尝试分离我的根。这是我的问题:

我想要一个主页,然后是一个完全不同的扩展页面,它不属于其他路线。

例如,假设我有 3 个页面:主页、关于,然后是一个 URL 为"mysite.com/username123"的用户页面。

现在我知道(或至少相信)这可以通过执行以下操作来实现:

var express = require('express');
var router = express.Router();
router.get('/:slug', function(req, res, next) {
    if(req.params.slug) {
        var data = { 
            my: 'data'
        };
        res.render('index', data);
    } else {
        var userdata = { 
            my: 'data'
        };
        res.render('user', userdata);
    }
});
module.exports = router;

但这不是我想做的;我想将它们保存在两个不同的路由文件中。所以我的应用程序.js文件将具有以下内容:

var routes = require('./routes/index');
var users = require('./routes/users');
var about = require('./routes/about');
app.use('/', index);
app.use('/', users);
app.use('/about', about);
如果有

蛞蝓,/users渲染的位置。这实际上有点有效。如果没有:slug,则加载索引文件,否则加载用户文件(路由文件中有 :slug,此处未显示)。但随后/about被覆盖。

现在我想我可以把/about推到列表的顶部,这会起作用,但这似乎非常草率,这样做的全部意义在于正确构建我的代码。

这样的情况应该如何妥善处理?有人可以在这里给我一些帮助吗?

发生这种情况是因为/about/:slug 覆盖。换句话说,快递无法判断about是否意味着slug

解决方案将是

  1. 添加一个 url 参数,让快递区分路由。

    router.get('/users/:slug')

  2. 跳到下一个路线

    router.get(':slug', function (req, res, next) {
       if (req.params.slug === 'about') {
          return next();
    }
      // get user data and render
      res.render('user', userdata);
    });
    

在此下方附加/about路由。

只需按此顺序重新排列路线即可

app.use('/about', about);
app.use('/:slug', users);

静态路由将优先于动态路由。

最新更新