javascript的Cookie是什么_如何设置和读取用户信息？-js教程-PHP中文网

javascript的Cookie是什么_如何设置和读取用户信息？

夢幻星辰

发布： 2025-12-21 11:32:11

原创

676人浏览过

Cookie是浏览器提供的客户端小型文本存储机制，用于保存登录状态等数据，由服务器通过Set-Cookie设置、浏览器自动回传，具大小限制、作用域控制及HttpOnly等安全属性。

javascript的cookie是什么_如何设置和读取用户信息？

Cookie 是浏览器提供的一种小型文本存储机制，用于在客户端（用户电脑）保存少量数据，比如登录状态、用户偏好或会话标识。它由服务器通过 HTTP 响应头 Set-Cookie 发送，浏览器自动保存，并在后续同源请求中通过 Cookie 请求头回传给服务器。

Cookie 的基本特点

• 每个 Cookie 大小通常限制在 4KB 左右，且同一域名下总数量有限（一般约 50 个）
• 默认是会话级的（关闭浏览器即失效），但可设置 Expires 或 Max-Age 变成持久化
• 支持作用域控制：Domain（指定可读取的域名）、Path（指定路径前缀）
• 安全相关属性：HttpOnly（JS 无法访问，防 XSS）、Secure（仅 HTTPS 传输）、SameSite（防 CSRF）

用 JavaScript 设置 Cookie

原生方式通过 document.cookie 字符串赋值实现，注意格式必须严格：

// 设置一个有效期 7 天的用户昵称 Cookie
document.cookie = "username=张三; max-age=604800; path=/; domain=.example.com; secure; SameSite=Lax";

// 设置 HttpOnly 的 Cookie 必须由后端写入，前端 JS 无法设置该属性

良精Wap企业网站管理系统 1.2

什么是企业WAP网站，企业3G网站企业WAP网站一般是指展示企业形象，介绍企业产品的WAP手机网站或者3G手机网站，让客户可以通过手机就能了解一个企业的大体情况和产品内容，从而更广泛的宣传企业，赢得更多的客户关注度！一般企业WAP网站包括：公司介绍，产品介绍，企业新闻动态，服务范围介绍，留言板，企业招聘信息等内容，如果有特殊要求，我们也会按照客户的要求定做。企业为何要建设手机WAP网站，3

查看详情

用 JavaScript 读取 Cookie

document.cookie 返回的是一个分号分隔的字符串，需手动解析：

立即学习“Java免费学习笔记（深入）”；

// 简单工具函数：按名称获取 Cookie 值

function getCookie(name) {<br>
  const cookies = document.cookie.split('; ');<br>
  for (let cookie of cookies) {<br>
    const [key, value] = cookie.split('=');<br>
    if (key === name) return decodeURIComponent(value);<br>
  }<br>
  return null;<br>
}

登录后复制

// 使用示例
const user = getCookie('username'); // "张三"

更安全实用的替代方案

现代开发中，直接操作 Cookie 存在局限性和安全风险，推荐组合使用：

• 敏感信息（如 token）优先由后端设为 HttpOnly + Secure + SameSite=Strict，前端不读写
• 非敏感偏好类数据（主题、语言）可用 localStorage 或 sessionStorage 替代，API 更友好
• 如需跨页面共享且需服务端参与的状态，仍用 Cookie，但建议封装工具类统一处理编码、过期和作用域
• 使用第三方库如 js-cookie 可简化操作并自动处理 URL 编码

以上就是javascript的Cookie是什么_如何设置和读取用户信息？的详细内容，更多请关注php中文网其它相关文章！