document.cookie与cookieStore.get获取Cookie属性差异及非cookieStore查询方案

API 探路者

2026-9-26

结论

浏览器前端原生API层面，不使用cookieStore的前提下没有办法直接读取Cookie的SameSite、Secure、Path、Domain等附加属性。

原因说明

document.cookie的设计规范就限定了它的返回值仅包含当前页面可访问的所有Cookie的name=value键值对拼接字符串，不会返回任何附加属性信息，这是浏览器的安全限制，避免恶意脚本获取Cookie的安全配置后用于针对性攻击。

可行替代方案

如果业务需要在前端获取Cookie的属性，可根据场景选择以下实现方式：

前端自行设置的Cookie：可以在设置Cookie的同时将对应属性存入本地存储做映射，后续读取时直接查询本地映射表即可，参考实现代码：

// 带属性存储的Cookie设置方法
function setCookie(name, value, attrs = {}) {
  // 拼接Cookie写入字符串
  let cookieSegments = [`${encodeURIComponent(name)}=${encodeURIComponent(value)}`]
  if (attrs.secure) cookieSegments.push('Secure')
  if (attrs.sameSite) cookieSegments.push(`SameSite=${attrs.sameSite}`)
  if (attrs.path) cookieSegments.push(`Path=${attrs.path}`)
  if (attrs.domain) cookieSegments.push(`Domain=${attrs.domain}`)
  if (attrs.expires instanceof Date) cookieSegments.push(`Expires=${attrs.expires.toUTCString()}`)
  
  document.cookie = cookieSegments.join('; ')
  // 存储属性映射到localStorage
  const cookieAttrMap = JSON.parse(localStorage.getItem('cookie_attr_map') || '{}')
  cookieAttrMap[name] = attrs
  localStorage.setItem('cookie_attr_map', JSON.stringify(cookieAttrMap))
}

// 查询Cookie属性方法
function getCookieAttrs(name) {
  const cookieAttrMap = JSON.parse(localStorage.getItem('cookie_attr_map') || '{}')
  return cookieAttrMap[name] || null
}