jquery在cookie中保存json数据对象

Posted 2023-03-10

【中文标题】jquery在cookie中保存json数据对象

【英文标题】：jquery save json data object in cookie

【发布时间】：2011-05-12 14:54:21

【问题描述】：

如何将 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 数据？

【问题讨论】：

只是迂腐，但您的问题中没有“JSON 数据”。您有一些通过对象文字表示法定义的 javascript 对象（不是 JSON，JSON 是对象文字表示法的子集），但那里没有 JSON。 json.org 不过，您几乎肯定希望使用 JSON 作为将对象存储在 cookie 字符串中的数据格式。

【参考方案1】：

将数据序列化为 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));

:)

【参考方案2】：

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

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

然后从cookie中获取：

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

这依赖于 JSON.stringify() and JSON.parse() 来序列化/反序列化您的数据对象，对于旧版浏览器 (IEjson2.js 以获取 JSON 功能。此示例使用jQuery cookie plugin

【讨论】：

自古以来 Opera 的 cookie 中不允许使用 JSON my.opera.com/community/forums/… 我也有这个错误。即使@cookie@ 插件使用@encodeURIComponent@，pbug 也不应该出现。

这个问答让我相信cookie 是jQuery 中的一个内置函数。似乎不是。还是已弃用..？如果是我找到的插件，链接到它会很好避免混淆......

@TJ 确实是一个插件，jQuery cookie 插件。你可以在这里找到它：plugins.jquery.com/cookie 我真的很想知道为什么它现在不在核心中......

在某些浏览器中使用它时要小心。 ,（逗号）字符可能会导致无法在 safari 和其他浏览器中正确设置 cookie。

如果不需要 jQuery，您也可以使用这个出色的轻量级 cookie 库。 [developer.mozilla.org/en-US/docs/Web/API/document/cookie]lib

【参考方案3】：

将JSON.stringify(userData) 返回的值保存到cookie 中是不好的做法；这可能会导致某些浏览器出现错误。

在使用它之前，你应该把它转换成base64（使用btoa），阅读它时，从base64转换（使用atob）。

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

write_cookie(val)

【讨论】：

你有没有提到有问题的浏览器？

我在 django 平台上的 chrome 上使用 json 列表作为 cookie。它有一些问题。此外，最好向用户隐藏 cookie 传递的实际数据

在服务器端，Python 的标准 cookie 处理将拒绝包含 或 的 cookie，并在 cookie 标头中静默丢弃被拒绝 cookie 之后的所有 cookie。

RFC6265 中的 Cookie 规范不允许使用诸如 " 之类的字符。这可能会导致服务器忽略请求中的某些 cookie。

【参考方案4】：

现在已经不需要显式使用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);

但是jquery.cookie没有自带JSON库，所以需要自己下载并包含在jquery.cookie.js之前的html页面中

【讨论】：

我在没有 $.cookie.json = true 的情况下尝试了这种方法，并将 [object object] 作为我的 cookie 值。然后将其设置为true并尝试将对象直接传递给cookie并且没有填充cookie。

@jacobross85 我认为我们中的一些人可能正在使用旧版本的 jquery.cookie.js，请检查源代码，有时错误的文件处于活动状态。

请注意，这将导致 cookie 被普遍视为 JSON。因此，盲目添加$cookie.json = true 可能会导致与您的其他cookie 发生冲突。因此，在其他地方已经使用 cookie 的项目上使用它时要小心！

你有什么解决复杂json的办法吗？我的 json 中有一个 json 数组，其中一些属性包含 json 和 ....

【参考方案5】：

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

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

为了从 cookie 中恢复，请使用 JSON.parse()

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

【参考方案6】：

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

快速使用：

创建 - 创建 cookie

检查 - 检查存在

验证 - 如果是 JSON，则验证 cookie 值

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");