Express API无法处理Cookie：Next.js中间件JWT鉴权失败排查

你的问题出在Next.js中间件的运行环境特性上：中间件运行在边缘节点（而非浏览器客户端），这里的fetch不会自动携带当前请求的Cookie——哪怕你设置了credentials: "include"也没用，这个参数只在浏览器环境下触发自动携带Cookie的行为，边缘环境不生效。

修复步骤 #

1. 从NextRequest中提取Cookie，手动传入fetch请求
   修改getUser函数，让它接收request参数，从请求头里拿到Cookie并添加到fetch的headers中：

async function getUser(request: NextRequest) {
  // 从当前请求头中获取Cookie
  const cookieHeader = request.headers.get('cookie');
  
  try {
    const res = await fetch(`${API_URL}/users/me`, {
      method: "GET",
      headers: {
        // 手动传递Cookie头
        ...(cookieHeader && { Cookie: cookieHeader })
      },
      // 边缘环境下credentials参数可省略，保留也不影响
      credentials: "include",
    });
    const data = await res.json();
    return data;
  } catch (e) {
    console.log(e);
    return { error: "请求用户信息失败" };
  }
}

2. 在中间件中调用时传入request对象
   修改middleware函数的调用逻辑，把当前的request传给getUser：

export async function middleware(request: NextRequest) {
  const user = await getUser(request);

  if (user.error) {
    const url = request.nextUrl.clone();
    url.pathname = "/";
    return NextResponse.redirect(url);
  }

  return NextResponse.next();
}

额外检查项 #

如果你的API和Next.js站点属于跨域场景，还需要确保Express后端的CORS配置正确：

const cors = require('cors');
// 替换成你的Next.js实际域名
const allowedOrigin = "https://your-nextjs-site.com";

app.use(cors({
  origin: allowedOrigin,
  credentials: true, // 必须开启，允许携带Cookie
  optionsSuccessStatus: 200
}));

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