В данный момент я создаю веб-сайт для клиента, и мы решили, что простым способом хранения «элементов», которые будут передаваться на поддомен из корня, будет хранение их в виде файлов cookie.Это прекрасно работает в обычном браузере, но когда я тестировал его в родном браузере, он работал не так гладко.Мне интересно, откуда могли возникнуть некоторые из этих проблем, и надеюсь, что вы, замечательные разработчики, сможете помочь человеку.Идея состоит в том, что на веб-интерфейсе, когда нажимается боковой ящик «Ваш заказ», запускается функция захвата файлов cookie, а затем сортировка их в указанные области содержимого -> Загружаемый контент, Запрошенный материал и Заказной контент.Для этого я создал две отдельные функции, одна из которых была исходной рабочей частью, а другая более специализированной и «хорошей практикой».
Попытка получить «Значение» файла cookie, содержащего значения, которые необходимо сохранить, напримерas, [itemname], [itemlocation], [itemdescription], [itemtype].Вторая функция хранит данные элемента в объекте, затем объект JSON.stringified и повторяется в цикле for.Затем он извлекается из строки с помощью JSON.parse () и далее повторяется в .each (), повторяя индекс (ключ) и val (значение).
FIRST FUNCTION:
$('section#review-downloads a.toggle-btn').bind('click tap', function() {
let cookies;
let itemSplit;
var section = $('section#review-downloads');
if(section.hasClass('active')) {
section.removeClass('active');
setTimeout(function() {
$('section#review-downloads .selected-items div').find('p').remove();
}, 900);
} else {
section.addClass('active');
$.each(document.cookie.split(';'), function() {
cookies = this.split('=');
let trimId = cookies[0].trim();
vals = cookies[1].replace(/[\])}[{(]/g, '');
if(!(cookies[0] === "envFilter")) {
$.each(vals.split('[ ]'),function() {
itemSplit = this.split(',');
let itemId = trimId;
let itemName = itemSplit[0];
let itemUrl = itemSplit[1];
let itemType = itemSplit[2];
let itemDesc = itemSplit[3];
if(itemType === ' Downloadable Content ') {
$('<p id="selected-item-'+itemId+'"><strong>'+itemName+'</strong>'+itemDesc+'</p>').appendTo('section#review-downloads .review-container .selected-items .downloadable-content');
} else if (itemType === ' Requested Materials ') {
$('<p id="selected-item"><strong>'+itemName+'</strong>'+itemDesc+'</p>').appendTo('section#review-downloads .review-container .selected-items .requested-material');
} else if (itemType === ' Bespoke Content ') {
$('<p id="selected-item"><strong>'+itemName+'</strong>'+itemDesc+'</p>').appendTo('section#review-downloads .review-container .selected-items .bespoke-content');
}
});
};
});
}
return false;
});
ВТОРАЯ ФУНКЦИЯ (лучшая практика)
$('div.support-item-wrapper div.order-add').bind('click tap', function() {
let id = $(this).data('id');
let name = $(this).data('title');
let file = $(this).data('file');
let type = $(this).data('type');
let desc = $(this).data('description').replace(/(\r\n|\n|\r)/gm, "");
let url = $(this).data('url');
let cookieVal = {
name: name,
file: file,
type: type,
desc: desc,
url: url
};
let string = JSON.stringify(cookieVal);
setCookie('product-'+id, string, 1);
});
$('section#review-downloads a.toggle-btn').bind('click tap', function() {
var section = $('section#review-downloads');
if(section.hasClass('active')) {
section.removeClass('active');
} else {
section.addClass('active');
let decoded_user_product;
cookie_values = document.cookie.split(';');
for(i = 0; i < cookie_values.length; i++) {
cookie_split = cookie_values[i].split("=");
cookie_key = cookie_split[0].trim();
cookie_value = cookie_split[1].trim();
// console.log(cookie_value);
if(cookie_key != "envFilter") {
decoded_user_product = JSON.parse(cookie_value);
}
$.each(decoded_user_product, function(index, val) {
// console.log("index:" + index + "& val:" + val);
if(index === "name") {
console.log(val);
} else if (index === "type") {
console.log(val);
} else if (index === "desc") {
console.log(val);
}
});
}
// console.log(decoded_user_product);
};
});
На рабочем столе результаты на отлично.Каждый элемент легко доступен для console.log () и легко сортируется в ПЕРВОЙ ФУНКЦИИ.На Mobile такие же результаты, как и следовало ожидать.Но после осознания того, что это не сработало, я использовал chrome: // inspect вместе со многими консольными журналами, чтобы прийти к выводу, что я, возможно, слишком неопытен, чтобы понять, какие части моего кода не могут работать в собственном браузере.