如何在 JavaScript 中通过解析 http cookie 头返回对象？

Cookie 是从网站发送到用户网络浏览器的小数据片段。它们用于存储有关用户的信息，例如他们的偏好或登录状态。

当用户访问网站时，他们的网络浏览器会向服务器发送请求。然后，服务器将发送响应，其中包含一组标头。其中一个标头是“Cookie” 标头，其中包含与网站关联的所有 Cookie 的列表。

解析 Cookie 标头

为了解析 Cookie 标头，我们需要首先将其拆分为各个名称-值对。这可以使用String.split() 方法完成。

获得名称-值对数组后，我们就可以循环遍历它并创建一个对象。该对象将使用 Cookie 名称作为键，使用 Cookie 值作为值。

假设我们有以下 Cookie 标头 -

Set-Cookie: username=john; expires=Thu, 18 Dec 2019 12:00:00 GMT; path=/;

我们可以像这样将其拆分为各个名称-值对 -

var pairs = header.split(';');

这将给我们以下数组 -

['username=john', 'expires=Thu, 18 Dec 2019 12:00:00 GMT', 'path=/']

然后，我们可以循环遍历此数组并创建对象 -

var cookies = {};
for (var i = 0; i < pairs.length; i++) {
   var nameValue = pairs[i].split('=');
   cookies[nameValue[0].trim()] = nameValue[1];
}

这将给我们以下对象 -

{ username: 'john', expires: 'Thu, 18 Dec 2019 12:00:00 GMT', path: '/' }

方法

  • 步骤 1 - 我们首先创建一个名为parseCookieHeader() 的函数。此函数将 Cookie 标头作为参数。

  • 步骤 2 - 我们使用String.split() 方法将标头拆分为各个名称-值对。

  • 步骤 3 - 我们创建一个空对象来存储 Cookie。

  • 步骤 4 - 我们使用 for 循环循环遍历所有名称-值对

  • 步骤 5 - 我们使用String.split() 方法将每个名称-值对拆分为数组。

  • 步骤 6 - 我们将数组的第一个元素（Cookie 名称）存储为 cookies 对象中的键。我们将数组的第二个元素（Cookie 值）存储为 cookies 对象中的值。

  • 步骤 7 - 我们返回 cookies 对象。

  • 步骤 8 - 我们从文档中获取 Cookie 标头。

  • 步骤 9 - 我们调用parseCookieHeader() 函数并传入 Cookie 标头。这将返回所有 Cookie 的对象。

  • 步骤 10 - 我们在控制台以及输出窗口中显示 Cookie。

示例

以下程序演示了如何解析 HTTP Cookie 标头并返回所有 Cookie 名称-值对的对象。这是完整的可运行代码 -

<!Doctype HTML>
<HTML>
<head>
   <title>Example</title>
</head>
<body>
   <h3> Parsing HTTP Cookie Header </h3>
   <p> Object of all cookie name-value pairs:</p>
   <div id="result"></div>
   <script>
      // Function to parse the cookie header
      function parseCookieHeader(header) {
      
         // Split the header into individual name-value pairs
         var pairs = header.split(';');
      
         // Create an object to store the cookies
         var cookies = {};

         // Loop through the name-value pairs and store them in the object
         for (var i = 0; i < pairs.length; i++) {
            var nameValue = pairs[i].split('=');
            cookies[nameValue[0].trim()] = nameValue[1];
         }
      
         // Return the object
         return cookies;
      }

      // Get the cookie header from the document
      var header = "username=john; expires=Thu, 18 Dec 2019 12:00:00 GMT; path=/;"

      // Parse the cookie header
      var cookies = parseCookieHeader(header);

      // Display the cookies
      console.log(cookies)
      document.getElementById("result").innerHTML = JSON.stringify(cookies)
   </script>
</body>
</html>

在本教程中，我们学习了如何在 JavaScript 中解析 Cookie 标头并返回所有 Cookie 名称-值对的对象。

更新于： 2022 年 8 月 3 日

3K+ 浏览量

开启你的 职业生涯

通过完成课程获得认证

开始学习
广告