jquery将json数据对象保存在cookie中

Question

如何将 JSON 数据保存在 cookie 中？

我的 JSON 数据看起来像这样

$("#ArticlesHolder").data('15', {name:'testname', nr:'4',price:'400'});
$("#ArticlesHolder").data('25', {name:'name2', nr:'1', price:'100'});
$("#ArticlesHolder").data('37', {name:'name3', nr:'14', price:'60'});

我想做类似的事情

var dataStore = $.cookie("basket-data", $("#ArticlesHolder").data());

并检索我想要将其加载到 $("#ArticlesHolder") 中的数据，就像

$.each($.cookie("basket-data"), function(i,e){
 $("#ArticlesHolder").data(i, e);
});

有人知道我是否走在正确的轨道上 一样或者应该以其他方式完成？简而言之，如何从 cookie 中放入和提取 json 数据？

Answer 1

您可以将数据序列化为 JSON，如下所示：

$.cookie("basket-data", JSON.stringify($("#ArticlesHolder").data()));

然后从 cookie 中获取它：

$("#ArticlesHolder").data(JSON.parse($.cookie("basket-data")));

这依赖于 < code>JSON.stringify() 和 JSON.parse() 来序列化/反序列化您的数据对象，对于较旧的浏览器 (IE<8) 包括 json2.js 来获取 JSON 功能。此示例使用 jQuery cookie 插件

Answer 2

现在已经不需要显式使用 JSON.stringify 了。只要执行这行代码

$.cookie.json = true;

就可以在cookie中保存任何对象，在读取cookie时会自动将其转换为JSON并从JSON返回。

var user = { name: "name", age: 25 }
$.cookie('user', user);
...

var currentUser = $.cookie('user');
alert('User name is ' + currentUser.name);

但是JSON库没有附带jquery.cookie，所以你必须自己下载它并在 jquery.cookie.js 之前包含到html页面中

Answer 3

使用 JSON.stringify(userData) 将 json 对象转换为字符串。

var dataStore = $.cookie("basket-data", JSON.stringify($("#ArticlesHolder").data()));

要从 cookie 中返回，请使用 JSON.parse()

var data=JSON.parse($.cookie("basket-data"))

Answer 4

将 JSON.stringify(userData) 返回的值保存到 cookie 并不是一个好习惯；它可能会导致某些浏览器出现错误。

在使用它之前，您应该将其转换为base64（使用btoa），并且在读取它时，从base64转换（使用atob ）。

val = JSON.stringify(userData)
val = btoa(val)

write_cookie(val)

Answer 5

将数据序列化为 JSON 和 Base64，依赖 jquery.cookie.js :

var putCookieObj = function(key, value) {
    $.cookie(key, btoa(JSON.stringify(value)));
}

var getCookieObj = function (key) {
    var cookie = $.cookie(key);
    if (typeof cookie === "undefined") return null;
    return JSON.parse(atob(cookie));
}

:)

Answer 6

试试这个：
https://github.com/tantau-horia/jquery-SuperCookie

快速使用：

创建 - 创建cookie

检查 - 检查是否存在

验证 - 验证 cookie 值（如果是 JSON）

check_index - 验证 JSON 中是否存在索引

read_values - 将 cookie 值读取为字符串

read_JSON - 将 cookie 值读取为 JSON 对象

read_value - 读取存储在 JSON 对象中的索引值

replace_value - 替换 JSON 对象中存储的指定索引的值

remove_value - 删除存储在 JSON 对象中的值和索引

只需使用：

$.super_cookie().create("name_of_the_cookie",name_field_1:"value1",name_field_2:"value2"});
$.super_cookie().read_json("name_of_the_cookie");