首页
学习
活动
专区
圈层
工具
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

js如何创建cookie

在JavaScript中,创建Cookie可以通过document.cookie属性来实现。以下是创建Cookie的基本步骤:

基本语法

代码语言:txt
复制
document.cookie = "key=value; expires=DATE; path=PATH; domain=DOMAIN; secure; samesite";

参数说明

  • key=value:设置Cookie的名称和值。
  • expires=DATE:设置Cookie的过期时间。DATE是一个GMT格式的日期字符串,例如:"Wed, 09 Jun 2021 10:18:14 GMT"。
  • path=PATH:指定Cookie的路径。默认情况下,Cookie只在当前路径及其子路径下有效。
  • domain=DOMAIN:指定Cookie的域。默认情况下,Cookie只在当前域及其子域下有效。
  • secure:如果存在,则Cookie只能在HTTPS连接中传输。
  • samesite:设置Cookie的同源策略,可以是StrictLaxNone

示例代码

以下是一个创建Cookie的示例:

代码语言:txt
复制
// 创建一个名为 "username" 的Cookie,值为 "JohnDoe",过期时间为7天
function setCookie(name, value, days) {
    let expires = "";
    if (days) {
        const date = new Date();
        date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
        expires = "; expires=" + date.toUTCString();
    }
    document.cookie = name + "=" + (value || "") + expires + "; path=/";
}

// 使用示例
setCookie("username", "JohnDoe", 7);

读取Cookie

要读取Cookie的值,可以使用以下函数:

代码语言:txt
复制
function getCookie(name) {
    const nameEQ = name + "=";
    const ca = document.cookie.split(';');
    for (let i = 0; i < ca.length; i++) {
        let c = ca[i];
        while (c.charAt(0) === ' ') c = c.substring(1, c.length);
        if (c.indexOf(nameEQ) === 0) return c.substring(nameEQ.length, c.length);
    }
    return null;
}

// 使用示例
console.log(getCookie("username")); // 输出: JohnDoe

删除Cookie

要删除Cookie,可以将其过期时间设置为过去的时间:

代码语言:txt
复制
function eraseCookie(name) {
    document.cookie = name + "=; Max-Age=-99999999; path=/";
}

// 使用示例
eraseCookie("username");

注意事项

  1. 安全性:避免在Cookie中存储敏感信息,因为Cookie可以被客户端脚本访问。
  2. 大小限制:每个域名下的Cookie总数和单个Cookie的大小都有限制(通常每个域名下最多20个Cookie,每个Cookie最大4KB)。
  3. 同源策略:Cookie遵循同源策略,只有相同协议、域名和端口的页面才能共享Cookie。

通过以上方法,你可以在JavaScript中创建、读取和删除Cookie。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

16分48秒

13-cookie和session/02-尚硅谷-Cookie-Cookie的创建

3分34秒

13-cookie和session/05-尚硅谷-Cookie-谷歌和火狐浏览器如何查看Cookie

31分6秒

32_尚硅谷_会话控制_Cookie的创建

22秒

编辑面板丨如何创建项目?

10分25秒

13-cookie和session/10-尚硅谷-Session-Session的创建和获取

27分22秒

37.尚硅谷_JS高级_对象创建模式.avi

10分22秒

20_如何参与开源项目_创建issue

15分19秒

21_如何参与开源项目_创建pull request

2分3秒

【蓝鲸智云】如何创建分级管理员

10分47秒

63.尚硅谷_JS基础_使用工厂方法创建对象

3分7秒

【蓝鲸智云】CMDB如何创建业务及拓扑

2分3秒

【蓝鲸智云】权限中心如何创建分级管理员

领券