求适配Passport的Express JS 4.0动态导航构建方案

嘿，好问题！你完全不用切换不同的nav.ejs模板——有更优雅的方式来实现和Passport兼容的动态导航，既灵活又易维护，下面给你拆解几种实用方案：

1. 基础版：用Passport内置方法做条件渲染 #

Passport已经帮你准备好了判断用户登录状态的核心方法req.isAuthenticated()，再结合用户的权限数据，就能直接在模板里动态生成导航项。

首先在你的全局中间件里，把用户状态和信息传递给所有模板：

// 在app.js或路由入口文件中添加
app.use((req, res, next) => {
  // Passport会把登录用户存在req.user里
  res.locals.currentUser = req.user;
  // 把登录状态转为布尔值，方便模板判断
  res.locals.isLoggedIn = req.isAuthenticated();
  next();
});

然后在nav.ejs里用EJS的条件语法渲染导航：

<nav>
  <ul>
    <!-- 所有用户可见的基础导航 -->
    <li><a href="/">Home</a></li>
    <li><a href="/about">About</a></li>
    
    <!-- 未登录时显示Login -->
    <% if (!isLoggedIn) { %>
      <li><a href="/login">Login</a></li>
    <% } %>
    
    <!-- 登录后显示专属导航，按权限过滤 -->
    <% if (isLoggedIn) { %>
      <li><a href="/dashboard">Dashboard</a></li>
      <!-- 示例：只有admin角色能看到管理面板 -->
      <% if (currentUser.role === 'admin') { %>
        <li><a href="/admin">Admin Panel</a></li>
      <% } %>
      <li><a href="/logout">Logout</a></li>
    <% } %>
  </ul>
</nav>

2. 进阶版：封装导航逻辑到工具函数 #

如果你的权限规则复杂（比如有N种角色、几十条路由），把导航生成逻辑抽成工具函数会让模板更干净，也方便后续维护。

先创建一个工具文件utils/navBuilder.js：

module.exports = (user) => {
  // 所有用户共享的基础导航项
  const baseNav = [
    { label: 'Home', path: '/' },
    { label: 'About', path: '/about' }
  ];

  // 未登录用户的导航
  if (!user) {
    return [...baseNav, { label: 'Login', path: '/login' }];
  }

  // 登录用户的基础导航
  const loggedInNav = [
    ...baseNav,
    { label: 'Dashboard', path: '/dashboard' },
    { label: 'Logout', path: '/logout' }
  ];

  // 根据用户角色追加权限专属项
  if (user.role === 'admin') {
    loggedInNav.push({ label: 'Admin Panel', path: '/admin' });
  }
  if (user.role === 'editor') {
    loggedInNav.push({ label: 'Content Editor', path: '/editor' });
  }

  return loggedInNav;
};

然后在全局中间件里调用这个函数，把生成好的导航数据传给模板：

const buildNav = require('./utils/navBuilder');

app.use((req, res, next) => {
  res.locals.navItems = buildNav(req.user);
  next();
});

最后在nav.ejs里循环渲染即可：

<nav>
  <ul>
    <% navItems.forEach(item => { %>
      <li><a href="<%= item.path %>"><%= item.label %></a></li>
    <% }) %>
  </ul>
</nav>

3. 关于现成插件：其实没必要 #

说实话，这类需求太个性化了——不同项目的权限规则、导航结构差异极大，几乎没有通用的“插件”能完美适配所有场景。但上面的两种方法已经足够轻量灵活，完全和Passport兼容，比切换多个模板要高效得多。

如果你的权限控制需要更精细的粒度，可以结合casl这类权限管理库，但核心逻辑还是基于用户数据的动态渲染，和上面的思路是一致的。

内容的提问来源于stack exchange，提问作者user257980