jquery сохраняет объект данных json в cookie


108

Как сохранить данные 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);
});

Кто-нибудь знает, на правильном ли я пути или это нужно делать как-то иначе? Проще говоря, как мне поместить и извлечь данные json из файла cookie?


8
Просто педантично, но в вашем вопросе нет "данных JSON". У вас есть некоторые объекты JavaScript, которые вы определили с помощью буквенной нотации объекта (не JSON, JSON - это подмножество буквальной нотации объекта), но там нет JSON. json.org Вы почти наверняка захотите использовать JSON в качестве формата данных для хранения ваших объектов в строке cookie.
TJ Crowder

Ответы:


195

Вы можете сериализовать данные как JSON, например:

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

Затем, чтобы получить его из файла cookie:

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

Это зависит от JSON.stringify()иJSON.parse() до сериализации / десериализации вашего объекта данных, для старых браузеров (IE <8) включают в себя json2.js получить JSONфункциональность. В этом примере используется плагин jQuery cookie


2
JSON не разрешен в файлах cookie для Opera с древних времен my.opera.com/community/forums/ ... У меня тоже есть эта ошибка. Даже если @ cookie @ plugin использует @ encodeURIComponent @, pbug не должен появляться.
kirilloid

1
Этот вопрос и ответ заставили меня поверить, что cookieэто встроенная функция в jQuery. Похоже, что нет. или это устарело ..? если это плагины, которые я нахожу, было бы здорово
TJ

1
@TJ Это действительно плагин, плагин jQuery cookie. Вы можете найти его здесь: plugins.jquery.com/cookie. Мне действительно интересно, почему его сейчас нет в ядре ...
Ник Крейвер

Будьте осторожны, используя это в некоторых браузерах. Символ ,(запятая) может привести к неправильной настройке файлов cookie в Safari и других браузерах.
Мэтт Сеймур,

Вы также можете использовать эту отличную легкую библиотеку файлов cookie, если jQuery не нужен. [ developer.mozilla.org/en-US/docs/Web/API/document/cookie] lib
RyBolt

40

Теперь уже нет необходимости JSON.stringifyявно использовать . Просто выполните эту строку кода

$.cookie.json = true;

После этого вы можете сохранить в cookie любой объект, который будет автоматически преобразован в JSON и обратно из JSON при чтении cookie.

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

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

Но библиотека JSON не поставляется с jquery.cookie, поэтому вам нужно загрузить ее самостоятельно и включить в html-страницу перед jquery.cookie.js.


3
Я пробовал этот подход без $ .cookie.json = true и получил [объект объекта] в качестве значения моего файла cookie. Затем установите для него значение true и попытайтесь передать объект непосредственно в файл cookie, но файл cookie не был заполнен.
JacobRossDev

@ jacobross85 Я думаю, что возможно, что некоторые из нас могут использовать старую версию jquery.cookie.js, пожалуйста, проверьте исходный код, иногда активен неправильный файл.
Декстер

Обратите внимание, что это приведет к тому, что файлы cookie будут обрабатываться как JSON. В результате слепое добавление $cookie.json = trueможет вызвать конфликты с другими вашими файлами cookie. Так что будьте осторожны, используя это в проекте, который уже использует файлы cookie где-либо еще!
Эрик Тьосем

у вас есть какое-нибудь решение для сложного json? у меня есть массив json в моем json, некоторые атрибуты которого содержат json и ....
насим джахедния

7

использовать JSON.stringify(userData)для прикрытия объекта json для строки.

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

и для возврата от использования файлов cookie JSON.parse()

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

4

Не рекомендуется сохранять значение, возвращаемое из JSON.stringify(userData)файла cookie; это может привести к ошибке в некоторых браузерах.

Перед использованием вы должны преобразовать его в base64 (используя btoa), а при чтении преобразовать из base64 (используя atob).

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

write_cookie(val)

3
У вас есть ссылка на браузер, в котором с этим возникают проблемы?
Marthin 03

1
Я использую список jsons в качестве файла cookie на Chrome на платформе django. у него есть некоторые проблемы. Кроме того, всегда лучше скрыть от пользователя фактические данные, передаваемые файлом cookie,
Эял Ч.

1
На стороне сервера стандартная обработка файлов cookie Python отклоняет файлы cookie, содержащие {или }, и молча отбрасывает любые файлы cookie, следующие за отклоненным файлом cookie в заголовке файла cookie.
snakecharmerb

2

С сериализацией данных как 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));
}

:)


0

Попробуйте это: https://github.com/tantau-horia/jquery-SuperCookie

Быстрое использование:

create - создать cookie

check - проверить наличие

verify - проверить значение 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");
Используя наш сайт, вы подтверждаете, что прочитали и поняли нашу Политику в отношении файлов cookie и Политику конфиденциальности.
Licensed under cc by-sa 3.0 with attribution required.