Next.js App Router中如何在middleware.ts读取Cookie？读取时返回undefined

以下是排查和解决该问题的具体步骤：

1. 确认Cookie在浏览器中已正确存储 #

打开浏览器开发者工具（F12），进入Application > Cookies > 你的域名，检查：

• session Cookie是否存在
• 路径（Path）是否为/
• 过期时间（Expires/Max-Age）是否为未来日期
• 开发环境下Secure选项是否未勾选（生产环境需勾选）

如果Cookie未出现在列表中，说明登录API路由的Cookie设置逻辑存在问题，优先排查这部分。

2. 检查Middleware的匹配路径配置 #

确保middleware.ts中的matcher包含需要处理的请求路径，否则Middleware不会对该请求执行逻辑：

export const config = {
  matcher: [
    // 匹配所有非静态资源、非API路由的路径
    '/((?!api|_next/static|_next/image|favicon.ico).*)',
    // 或指定具体需要处理的路径
    '/dashboard/:path*',
    '/profile'
  ],
};

3. 确保在Middleware函数内部读取Cookie #

cookies()函数只能在请求处理的上下文内调用，不能在Middleware函数外部执行：

import { NextResponse } from 'next/server';
import type { NextRequest } from 'next/server';
import { cookies } from 'next/headers';

export function middleware(request: NextRequest) {
  // 必须在函数内部调用cookies()
  const sessionCookie = cookies().get('session');
  
  // 调试用：打印Cookie信息
  console.log('Session Cookie:', sessionCookie);

  // 后续逻辑示例
  if (!sessionCookie) {
    return NextResponse.redirect(new URL('/login', request.url));
  }
  
  return NextResponse.next();
}

4. 验证Cookie属性与环境的兼容性 #

• Secure属性：开发环境（NODE_ENV=development）下必须设为false，否则浏览器不会存储Cookie（localhost默认用HTTP）；生产环境需设为true（HTTPS）。
• SameSite属性：strict模式下，只有同站请求才会携带Cookie。如果测试场景是跨站跳转（比如从外部链接进入），Cookie不会被携带，可临时改为lax验证，之后再改回strict保证安全性。
• Expires日期：确保session.expire是有效的未来时间戳，否则Cookie会立即过期。

5. 检查请求头是否携带Cookie #

在浏览器开发者工具的Network面板中，查看目标请求的Request Headers，确认Cookie字段包含session=xxx。如果没有，说明浏览器未发送Cookie，需回到步骤1和4排查属性配置。

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