时间戳

首页 > 解决方案 > 创建一个简单的多维对象数组并分配给 cookie

javascript - 创建一个简单的多维对象数组并分配给 cookie

问题描述

我正在尝试为匿名用户创建一个购物车，该购物车存储在用户计算机上的 cookie 中。但我很困惑。

这是我的代码

  $(document).ready(function () {
                var PID = $('#Input_Product').val();
                var Qty = $('#Input_Qty').val();
                var P = $('#Input_Price').val();

                var data = { ProductID: PID, Quantity: Qty, Price: P };


 $("#btnWrite").click(function () {
                    // $.cookie("Name", $("#txtName").val());
                    document.cookie = "Product='+PID+'; expires=Friday, 20 Sep 2019 01:00:00 UTC; path=/ ;";
 document.cookie = "Quantity='+Qty+'; expires=Friday, 20 Sep 2019 01:00:00 UTC; path=/;";
 document.cookie = "Price='+P+'; expires=Friday, 20 Sep 2019 01:00:00 UTC; path=/;";
                });

我想要实现的是获取一个多维对象数组并将购物篮的值分配给一个 cookie 或多个 cookie。

同样是 javascript 的新手，如何在客户端检索值。我知道我可以使用 stringify 发布到服务器

我尝试使用它进行初始化，但出现错误

  for (var i = 0; i < 1; i++) {
 data[i] = new { ProductID: PID, Quantity: Qty };
alert(data[i]);
}

标签： javascriptarraysjavascript-objects

解决方案

曲奇之路

Cookie 不能存储空格或逗号，每个赋值语句只能存储一个键值对。您可以将每个值分开并将其分配给 cookie，如下所示：

document.cookie = "Product=+PID+;"
document.cookie = "expires=+DATESTRING+;"
document.cookie = "path=+PATH+;"

但是，每当您像这样分配另一个 cookie 时，以前的 cookiepath和expires将被覆盖。更好的方法是将所有数据编码为 cookie 安全字符串：

document.cookie = "Product=+PID+DATESTRING+PATH+;"

然后您可以查找产品并使用.split('+').

现代方式

与 localStorage 相比，Cookie 有几个缺点。最有影响的两个是 (1) 浏览器中的 cookie 通过每个 http/s 请求发送（潜在的个人信息泄露）和 (2) cookie 的数据存储限制为 4KB，localStorage 允许 5MB（明显更多！ ）。

要在此处以您想要的方式使用它，您可以执行以下操作：

// setting it:
localStorage.setItem('Product', '+PID+DATESTRING+PATH+')
// getting it: 
const productData = localStorage.getItem('Product').split('+')
const productId = productData[0]
const productDate = productData[1]
const productPath = productData[2]

希望有帮助！

推荐阅读