如何在NextJS中间件中解析并获取Cookie值？

在Next.js的Edge中间件中，request.cookies是Next.js封装的RequestCookies对象，并非普通键值对对象，直接打印会显示内部结构，导致你看到{ cookie: 'cookie=value; Path=/' }这类输出。以下是几种无需第三方库的原生解决方案：

方案1：使用Next.js原生RequestCookies API #

直接利用get()方法获取单个Cookie值，或通过forEach()遍历所有Cookie：

export function middleware(request) {
  if (request.nextUrl.pathname.startsWith('/nesto')) {
    // 获取指定名称的Cookie值
    const targetCookieValue = request.cookies.get('cookie')?.value;
    console.log(targetCookieValue); // 输出对应的value

    // 遍历所有Cookie，转为普通键值对对象
    const allCookies = {};
    request.cookies.forEach((value, name) => {
      allCookies[name] = value;
    });
    console.log(allCookies); // 输出{ cookie: 'value', ...其他Cookie }
  }
}

方案2：手动解析Cookie请求头 #

如果需要更灵活的处理，可以直接从请求头中获取原始Cookie字符串并手动解析：

export function middleware(request) {
  const cookieHeader = request.headers.get('cookie');
  if (cookieHeader) {
    // 解析为键值对对象
    const cookies = Object.fromEntries(
      cookieHeader.split('; ').map(cookie => cookie.split('='))
    );
    console.log(cookies.cookie); // 输出对应的value
  }
}

为什么第三方库无法使用 #

你尝试的cookie-parser、next-cookies等库大多依赖Node.js核心API，而Next.js中间件运行在Edge Runtime（而非Node.js环境），这类API在Edge环境中不可用，因此会出现解析失败的情况。优先使用上述原生方法即可解决问题。

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