如何使用 javascript/jquery 对 cookie 进行编码？

Question

I am working on an online shop together with my friend. He set a cookie for me with PHP with the amount of added products to the Cart. The cookie is called "cart", and the variable with the amount of the products is called "items".

And I have to read the cookie and get the value of "cart" back with javascript and print it in the HTML document, but I have no Idea how to use it, can you please help me? I have never worked with cookies or JSON before, but I think it should be done with JSON, can you please explain it to me how it works?

when I do : console.log(document.cookie);

I receive something like this: cart=%7B%22items%22%3A%7B%228%22%3A1%7D%7D;

And I have no idea how to encode it.

Thank you

Answer 1

That is the URL encoded equivalent of {"items":{"8":1}} which is the JSON string you want.

All you have to do is decode it and parse the JSON:

var cart = JSON.parse(decodeURIComponent(document.cookie.cart));

Then logging cart should give you an object with an 'items' property that you can access as needed.

EDIT:

As an example, here's a way to iterate through the items and determine the total number of items and the total of all their quantities.

var items_total = 0,
    quantity_total = 0;
for (var prop in cart.items) {
    items_total += 1;
    quantity_total += cart.items[prop];
}

console.log("Total Items: " + items_total);
console.log("Total Quantities: " + quantity_total);

Answer 2

Looks like you just need to decode it, then you will want to parse/eval it to get a workable object:

var obj, decoded = decodeURIComponent(document.cookie.cart);
if(window.JSON && JSON.parse){
  obj = JSON.parse(decoded);
} else {
  eval('obj = ' + decoded);
}
// obj == {"items":{"8":1}};