在Next.js中如何获取HTTP-only类型的Cookie值？

req.headers.cookie返回的是所有Cookie拼接的原始字符串，格式为key1=value1; key2=value2，并非解析后的键值对对象，因此直接访问.token属性会返回undefined。

方法1：使用已安装的cookie包（推荐） #

你项目中已经安装了cookie依赖，直接调用其parse方法即可完成解析，能自动处理编码、特殊字符等边界情况，稳定性最高：

import cookie from 'cookie'

// 传入空字符串做容错处理，避免Cookie为空时报错
const parsedCookies = cookie.parse(req.headers.cookie || '')
// 直接提取token值
const token = parsedCookies.token
console.log(token)

方法2：手动解析（仅适合简单场景） #

如果不想依赖第三方包，也可以通过字符串拆分实现基础解析，遇到值包含特殊字符、等号的Cookie时可能出现解析异常：

const extractToken = (cookieStr) => {
  if (!cookieStr) return undefined
  const cookiePairs = cookieStr.split('; ').map(item => item.split('='))
  const cookieObj = Object.fromEntries(cookiePairs)
  return cookieObj.token
}

const token = extractToken(req.headers.cookie)
console.log(token)

该解析逻辑仅可在服务端执行，你设置的是httpOnly: true的Cookie，前端JavaScript无法读取到该Cookie值，只能在Next.js的API路由、getServerSideProps、服务端组件等服务端场景下通过请求头获取。

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