js cookie 中文

在JavaScript中处理Cookie时，如果Cookie的值包含中文字符，可能会遇到编码问题。这是因为HTTP协议中的Cookie值需要进行URL编码，以确保特殊字符不会干扰Cookie的解析。

基础概念

Cookie: 是存储在用户浏览器上的一小段数据，它可以包含一些信息，比如用户的登录状态、购物车内容等。
URL编码: 当数据需要通过URL传递时，特殊字符会被转换成特定格式，以便于传输和解析。

类型

会话Cookie: 不设置过期时间，浏览器关闭后失效。
持久Cookie: 设置了过期时间，即使浏览器关闭也会保留，直到过期。

应用场景

用户认证: 存储用户的登录状态。
购物车功能: 记录用户的购物车内容。
个性化设置: 存储用户的偏好设置。

遇到的问题及原因

当Cookie值包含中文字符时，如果不进行URL编码，可能会导致服务器无法正确解析Cookie值，因为中文字符在URL中不是有效的字符。

解决方法

在设置Cookie时，对中文字符进行URL编码；在读取Cookie时，进行URL解码。

设置Cookie（包含中文字符）

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();
    }
    // 对中文字符进行URL编码
    document.cookie = name + "=" + encodeURIComponent(value) + expires + "; path=/";
}

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

读取Cookie（包含中文字符）

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) {
            // 对中文字符进行URL解码
            return decodeURIComponent(c.substring(nameEQ.length, c.length));
        }
    }
    return null;
}

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