设置cookie javascript

在浏览器中，cookie是存储在客户端上的一小段文本。当用户访问网站时，可以通过cookie保存一些信息，如登录状态、购物车中的商品等。如果你是一名前端程序员，你需要了解如何在JavaScript中设置cookie。

设置cookie

你可以使用JavaScript的document.cookie属性设置cookie。document.cookie是一个字符串，它包含了当前页面的所有cookie。如果要设置新的cookie，你需要添加一个新的键值对到这个字符串中。如下所示：

document.cookie = "key=value"

这将在当前浏览器中创建一个名为key，值为value的cookie。

如果你要设置多个cookie，你需要在每个cookie之间添加;进行分隔。如下所示：

document.cookie = "key1=value1; key2=value2; key3=value3"

设置带有过期时间的cookie

默认情况下，cookie是会话性的，也就是说它们会在浏览器关闭时自动删除。如果你想要设置一个带有过期时间的cookie，你需要在cookie字符串中添加Expires或Max-Age属性。这两个属性都用于指定cookie的过期时间。其中，Expires属性是一个GMT日期，而Max-Age属性是指cookie在多少秒后过期。如下所示：

// 设置过期时间为1天，并将cookie写入当前浏览器
let now = new Date()
let time = now.getTime() + 24 * 3600 * 1000 // 过期时间为1天后
now.setTime(time)
document.cookie = "key=value; Expires=" + now.toUTCString()

// 或者使用Max-Age属性
document.cookie = "key=value; Max-Age=86400" // 86400秒 = 1天

设置安全cookie

HTTP协议是不安全的，因为它传输的信息是明文的，易受攻击。但是，HTTPS协议可以保证通信的安全性，因为它使用了SSL/TLS加密技术。如果你想要增强cookie的安全性，你可以设置Secure属性，使cookie只在HTTPS连接时发送。如下所示：

document.cookie = "key=value; Secure"

设置只读cookie

有时候，你可能会想要设置一个只读的cookie，这意味着它不能通过JavaScript进行修改。你可以设置HttpOnly属性实现这一点。如下所示：

document.cookie = "key=value; HttpOnly"

设置cookie的路径和域

默认情况下，cookie的作用域是当前页面的URL。如果你想要让cookie在多个页面之间共享，你可以设置Path和Domain属性。Path属性用于指定cookie的作用路径，而Domain属性用于指定cookie的作用域。如下所示：

// 设置cookie的作用路径为根目录下的所有子目录和页面
document.cookie = "key=value; Path=/"

// 设置cookie的作用域为example.com及其所有子域名
document.cookie = "key=value; Domain=example.com"

获取cookie

如果你想要获取当前页面的cookie，你可以通过document.cookie属性实现。document.cookie是一个字符串，包含了当前页面的所有cookie。你可以使用正则表达式或字符串操作函数来获取特定的cookie值。如下所示：

// 获取名为key的cookie的值
function getCookieValue(key) {
  let arr, reg = new RegExp("(^| )" + key + "=([^;]*)(;|$)")
  if (arr = document.cookie.match(reg)) {
    return arr[2]
  } else {
    return null
  }
}

let value = getCookieValue("key") // 获取名为key的cookie的值

删除cookie

如果你想要删除一个cookie，你可以将它的过期时间设置为过去的某个时间，浏览器会自动将它删除。如下所示：

function deleteCookie(key) {
  let now = new Date()
  now.setTime(now.getTime() - 1)
  document.cookie = key + "=; Expires=" + now.toUTCString()
}

deleteCookie("key") // 删除名为key的cookie

以上就是设置cookie的JavaScript相关知识，请遵守相关规则并灵活运用。