如何在JavaScript中有效地记录Cookie？

JS 记录 Cookie

Cookie 是服务器保存在浏览器的一小段文本信息，每当浏览器再次访问服务器时，这些信息会被发送到服务器，JavaScript 可以读取和设置 cookie，但有一些限制，下面是一个详细的指南，介绍如何使用 JavaScript 来操作 Cookie。

创建 Cookie

要创建一个 cookie，你可以使用document.cookie 属性，这个属性提供了一种简单的方法来读取和写入 cookie，以下是创建一个名为 "username" 的 cookie，值为 "John Doe" 的示例：

document.cookie = "username=John Doe";

注意，这只会创建一个新的 cookie，如果已经存在相同名称的 cookie，它将被覆盖。

读取 Cookie

你可以使用document.cookie 属性来读取所有的 cookie，这将返回一个字符串，其中包含了所有的 cookie，每个 cookie 由分号和空格分隔。

var x = document.cookie;

你需要解析这个字符串以获取特定的 cookie，以下是一个函数，它接受一个参数（cookie 的名字），并返回相应的值：

function getCookie(cname) {
    var name = cname + "=";
    var decodedCookie = decodeURIComponent(document.cookie);
    var ca = decodedCookie.split(';');
    for(var i = 0; i <ca.length; i++) {
        var c = ca[i];
        while (c.charAt(0) == ' ') {
            c = c.substring(1);
        }
        if (c.indexOf(name) == 0) {
            return c.substring(name.length, c.length);
        }
    }
    return "";
}

删除 Cookie

要删除一个 cookie，你只需要设置它的过期日期为过去的某个时间点，以下是一个函数，它接受一个参数（cookie 的名字），并删除相应的 cookie：

function deleteCookie(cname) {
    document.cookie = cname+"=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;";
}

相关问题与解答

Q1: JavaScript 能否读取 HTTPOnly 标记的 Cookie?

A1: 不能，HTTPOnly 是一种安全措施，用于防止客户端脚本访问敏感的 cookie，如果一个 cookie 被标记为 HTTPOnly，JavaScript 将无法读取或修改它。

Q2: JavaScript 能否跨域名访问 Cookie?

A2: 不能，由于同源策略的限制，JavaScript 只能访问当前域名下的 cookie，这意味着如果你的网站在 "example.com"，你不能使用 JavaScript 访问 "test.com" 的 cookie。