JavaScript 如何列出当前页面的所有Cookie

在本文中，我们将学习如何使用JavaScript获取当前页面的所有Cookie列表，并通过示例了解它们的实现。任务是检索存储在当前域中的Cookie（由于安全原因，我们无法获取所有Cookie）。下面讨论了解决此问题的两种方法。

方法1

• 使用 document.cookie 访问Cookie。
• 使用 .split()方法 将Cookie以“;”分割为一个Cookie数组。
• 遍历Cookie数组。
• 将所有Cookie依次添加到字符串中进行打印。

示例： 下面的示例实现了上述方法。

function getCookies() {
    let cookie = "username=geeks;expires=Mon, 18 Dec 2023;path=/"; 
    let cookies = cookie.split(';');
    let ret = '';
     
    for (let i = 1; i <= cookies.length; i++) {
        ret += i + ' - ' + cookies[i - 1] + "\n";
    }
 
    return ret;
}
 
console.log(getCookies());

输出

1 - username=geeks
2 - expires=Mon, 18 Dec 2023
3 - path=/

方法2

• 使用 document.cookie 获取cookies。
• 使用 .split() 方法 将cookies以“;”分割为一个数组。
• 使用 .reduce() 方法 逐个访问每个cookie。
• 获取cookie的名称和值。对于每个cookie，使用 .split() 方法 将其以“=”分割，获取cookie的 名称和值 。
• 这种方法与之前的方法相同，将cookies作为一个对象返回。

示例： 该示例实现了上述方法。

function getCookies() {
    let cookie = "username=geeks;expires=Mon, 18 Dec 2023;path=/";
 
    let cookies = cookie.split(';').reduce(
        (cookies, cookie) => {
            const [name, val] = cookie.split('=').map(c => c.trim());
            cookies[name] = val;
            return cookies;
        }, {});
    return cookies;
}
 
console.log(getCookies());

输出

{ username: 'geeks', expires: 'Mon, 18 Dec 2023', path: '/' }