ReactJS/ExpressJS前端访问服务端session校验用户认证状态

你打算直接在前端检查服务端session.user字段的思路不可行。
服务端session数据是存储在服务端存储介质（内存、数据库、Redis等）中的，前端代码没有直接访问服务端存储的权限，前端只能拿到存在本地Cookie中的session ID，无法通过这个ID直接读取服务端session里存储的内容，自然没法直接判断session.user是否存在。
另外注意不要把服务端session和浏览器端的sessionStorage搞混，这是两个完全独立的东西：后者是前端本地存储，和服务端会话没有关联，就算你在sessionStorage里自行写入登录标记，用户也可以手动修改，完全没有安全性可言。

现有逻辑的优化点 #

你当前的登录逻辑本身可以正常完成会话鉴权，但存在一个风险点：你直接把数据库查询返回的整行用户数据存在了req.session.user里，建议只筛选必要的非敏感字段存储，不要把密码哈希、用户私密信息这类内容放进session，避免数据泄露。
优化后的登录逻辑参考：

module.exports = {
  login: function(req, res){
    const {email, password} = req.body;
    UserModel.authenticate(email, password, function(err, result){
      if(err){
        throw err;
      }
      if (result.rows.length == 0){
        return res.status(404).send('Bad credentials');
      }
      // 只存必要的非敏感字段
      const userInfo = result.rows[0];
      req.session.user = {
        id: userInfo.id,
        email: userInfo.email
        // 按需添加需要的字段，比如用户名、角色权限等
      };
      return res.sendStatus(200);
    });
  }
}

推荐的前端认证状态实现方案 #

核心原则：所有鉴权逻辑以后端校验结果为准，前端存储的认证状态仅用于优化页面交互体验，不能作为最终鉴权依据。
具体实现分三步：

• 后端新增认证状态查询接口
  新增一个无额外参数的接口（比如GET /api/auth/status），逻辑就是判断当前请求携带的session对应的req.session.user是否存在，存在就返回已认证状态和用户基本信息，不存在就返回未认证状态：

  // 新增到后端路由处理逻辑中
  getAuthStatus: function(req, res) {
    if (req.session.user) {
      return res.status(200).json({
        isAuthenticated: true,
        user: req.session.user
      })
    }
    return res.status(401).json({
      isAuthenticated: false
    })
  }
  

• 前端全局维护认证状态
  用React的Context API或者常用的状态管理工具（Zustand、Redux均可）存储两个全局状态：isAuthenticated（布尔值，标记是否登录）、currentUser（存储当前登录用户的基本信息）：
  • 应用首次加载的时候，先调用/api/auth/status接口，拿到后端返回的真实状态后再渲染页面，加载过程中可以展示全局loading，避免未登录用户看到需要权限的页面内容闪屏。
  • 登录请求成功、登出请求完成后，重新调用一次状态接口同步最新值，也可以在登录成功后直接手动更新状态，减少一次冗余请求。
• 统一处理接口鉴权异常
  给项目里所有接口请求加统一的响应拦截：如果任意接口返回401未授权状态码，直接清空前端全局存储的认证状态，强制跳转到登录页即可，不用每个业务页面单独写判断逻辑。

额外注意事项 #

• 配置express-session的时候，一定要开启httpOnly: true配置，禁止前端JS读取session对应的Cookie，避免XSS攻击窃取用户会话。
• 如果前端和后端是不同端口/域名部署的跨域场景，要先给后端配置好CORS规则允许携带凭证，同时前端发请求的时候要开启携带Cookie的配置：用axios的话设置withCredentials: true，用原生fetch的话设置credentials: 'include'，否则后端无法识别到请求对应的session。
• 不要把前端本地存储（localStorage、sessionStorage）里存的自定义登录标记作为唯一鉴权依据，这类存储用户可以手动篡改，只能用来做临时体验优化，所有涉及权限的操作最终都要靠后端校验session。

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