MERN全栈项目学校登录授权异常：Unauthorized无有效令牌

以下是针对你场景的核心排查方向和修复方案：

1. 前端请求未携带Cookie（跨域场景必查） #

如果前后端跨域部署，默认情况下fetch/axios不会自动携带Cookie，导致后端无法获取令牌。

• Axios修复示例：

  // WelcomeAfterSchoolLogin页面的useEffect请求配置
  useEffect(() => {
    axios.get('/api/school/dashboard', {
      withCredentials: true // 关键：允许携带跨域Cookie
    })
    .then(res => console.log(res.data))
    .catch(err => console.log(err.response.data))
  }, [])
  

• Fetch修复示例：

  useEffect(() => {
    fetch('/api/school/dashboard', {
      credentials: 'include' // 关键：携带Cookie
    })
    .then(res => res.json())
    .then(data => console.log(data))
    .catch(err => console.log(err))
  }, [])
  

2. 后端中间件未正确读取Cookie中的令牌 #

确认authenticate.js是否从Cookie提取令牌，而非错误读取Authorization头：

// authenticate.js 正确读取Cookie示例
const jwt = require('jsonwebtoken');
const config = require('../config/config.env');

module.exports = (req, res, next) => {
  // 从Cookie获取令牌，而非req.headers.authorization
  const token = req.cookies.token; 
  if (!token) {
    return res.status(401).json({ error: 'Unauthorized: No valid token provided' });
  }

  try {
    const decoded = jwt.verify(token, config.SECRET_KEY);
    req.school = decoded; // 将解码后的学校信息挂载到req对象
    next();
  } catch (err) {
    return res.status(401).json({ error: 'Unauthorized: Invalid token' });
  }
};

3. 令牌生成与校验的SECRET_KEY不一致 #

检查auth.js生成令牌时的SECRET_KEY，是否和authenticate.js中校验的完全一致（包括大小写、特殊字符）：

// auth.js 生成令牌示例（确保SECRET_KEY来源正确）
const token = jwt.sign({ _id: school._id }, process.env.SECRET_KEY, { expiresIn: '1d' });
// 设置Cookie时适配环境（开发环境secure设为false）
res.cookie('token', token, {
  expires: new Date(Date.now() + 24 * 60 * 60 * 1000),
  httpOnly: true,
  secure: process.env.NODE_ENV === 'production' // 生产环境开启secure
});

4. 路由中间件挂载顺序错误 #

确保authenticate.js中间件挂载在需要授权的路由之前：

// 错误示例：中间件在路由之后，无法生效
router.get('/dashboard', (req, res) => { ... }, authenticate);

// 正确示例：中间件在路由处理函数之前
router.get('/dashboard', authenticate, (req, res) => {
  res.json({ message: 'Welcome to school dashboard' });
});

5. useEffect请求时机过早 #

登录成功后立即跳转可能导致Cookie未完成写入，可添加延迟或在登录回调中确认Cookie存在后再跳转：

// SchoolLogin页面登录提交逻辑
const handleLogin = async (e) => {
  e.preventDefault();
  const res = await axios.post('/api/auth/school-login', loginData, { withCredentials: true });
  // 确认Cookie存在后再跳转
  if (res.data.success) {
    setTimeout(() => {
      navigate('/school-welcome');
    }, 300);
  }
};

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