Znikające ciasteczka po ponownym wejściu na stronę

0

Witam.
Stworzyłem skrypt, dzięki któremu po wejściu na stronę wyświetlany jest komunikat odnośnie przetwarzania danych i polityki cookies. Poniżej znajduje się również lista partnerów współpracujących ze stroną i przy każdym z nich widnieje link do polityki prywatności oraz checkbox, dzięki któremu można zatwierdzić poszczególnego partnera. Wszystko działa prawidłowo. Po zaakceptowaniu okna, ciasteczka zostają zapisane prawidłowo i wszystkie ciasteczka dla partnerów (jest ich 585 + jedno ogólne odnośnie zaakceptowania popupa) zostają utworzone z wartością true lub false, w zależności od zaakceptowania. W zakładce "Dane" przy cookies dla danej strony jest jedynie problem, że nie widać tam ciasteczka dla partnera z indeksem zerowym, jednak po wpisaniu w konsoli document.cookie lub użyciu stworzonej przeze mnie funkcji getCookies("popup-checkbox-0"); ciasteczko to jest widoczne. To pierwszy problem. Drugim jest to, że gdy strona zostanie zamknięta i ponownie się na nią wejdzie to większość ciasteczek po prostu znika, a zostają wyłącznie od popup-checkbox-420 aż do końca. Co się dzieje z pozostałymi 420 ciasteczkami? Nie mam pojęcia. Po wpisaniu document.cookie również pojawiają się tylko ciasteczka od popup-checkbox-420 w górę + jedno ogólne dla popupa. Mam nadzieję, że ktoś z Was może będzie wiedział i mi pomoże. Poniżej zamieszczam kawałek kodu, a konkretnie funkcji, która odpowiada za wciśnięcie przycisku akceptacji, jednak to raczej nie z kodem jest coś nie tak, ponieważ domyślnie działa on prawidłowo (z wyjątkiem tego, że nie widać zerowego ciasteczka w Danych). Problem pojawia się dopiero przy ponownym wejściu na stronę.

PS: trzeci argument w funkcji setCookie (1), to liczba dni na jaką ustawiane jest ciasteczko.

function acceptPopup(amount) {
      console.log(amount)
      for (i = 0; i < amount; i++) {
        let checkbox = document.getElementById("popup-checkbox-" + i).checked;
        if (checkbox) {
          setCookie("popup-checkbox-" + i, true, 1);
          console.log(i + ' true');
        } else {
          setCookie("popup-checkbox-" + i, false, 1);
          console.log(i + ' false');
        }
      }
      setCookie("popupCookies", true, 1);
      window.onscroll = function () { };
      document.body.removeChild(popup);
    }
0

Poniżej wrzucam funkcję setCookies oraz wycinek fetchowania danych z API:

function setCookie(name, value, days, path, domain, secure) {
  if (!navigator.cookieEnabled) return;
  const e = encodeURIComponent;
  let cookie = e(name) + "=" + e(value);
  if (typeof days === "number") {
    const date = new Date();
    date.setTime(date.getTime() + days * 1000 * 60 * 60 * 24);
    cookie += "; expires=" + date.toGMTString();
  }
  if (path) {
    cookie += "; path=" + path;
  }
  if (domain) {
    cookie += "; domain=" + domain;
  }
  if (secure) {
    cookie += "; secure;";
  }
  document.cookie = cookie;
}
fetch(url)
      .then(response => response.json())
      .then(data => {
        let vendors = data.vendors;

        popup_button_reject.addEventListener('click', rejectPopup, false);
        popup_button_accept.addEventListener('click', acceptPopup.bind(e, vendors.length), false);

        return vendors.map((vendor, index) => {
          let popup_body_li = document.createElement("li"),
            popup_body_li_span = document.createElement("span");

          popup_body_li.setAttribute('class', 'popup-body-li');
          popup_body_li_span.setAttribute('class', 'popup-body-li-span');

          popup_body_li_span.innerHTML = `<strong>${vendor.name}</strong> <a href="${vendor.policyUrl}" target="_blank">Privacy Policy</a> <input type="checkbox" class="popup-body-li-checkbox" id="popup-checkbox-${index}" checked>`;
          popup_body_li.appendChild(popup_body_li_span);
          popup_body_ul.appendChild(popup_body_li);
        })
      })
      .catch(error => console.log(error))
1

Metodą prób i błędów doszedłem do wniosku, że problem leży w limicie ciasteczek w poszczególnych przeglądarkach na daną domenę. Dziwi mnie tylko, że dosyć trudno mi było na ten temat jakiekolwiek informacje znaleźć w internecie. Sprawdziłem również jak to wygląda na innych stronach, gdzie podobnie można zaakceptować poszczególnych partnerów, a ich liczba jest spora. Z tego co zauważyłem, tworzone jest jedno ciasteczko, które zawiera zakodowany ciąg znaków i chyba (?) to tam jest to wszystko zawarte. Wie ktoś może czy jest jakiś prosty sposób na upchanie obiektu do postaci prostego, niedługiego stringa?

EDIT: Rozwiązałem ten problem poprzez kodowanie wartości false i true do zera i jedynek. Nie wiem czy jest to optymalny sposób a tym bardziej praktyczny, ale jeżeli ktoś jest lepiej w tym rozeznany to może się wypowiedzieć :D Poniżej kod funkcji:

function acceptPopup(amount) {
      let vendors = "";
      for (i = 0; i < amount; i++) {
        let checkbox = document.getElementById("popup-checkbox-" + i).checked;
        if (checkbox) {
          vendors += "1";
        } else {
          vendors += "0";
        }
      }
      setCookie("popupVendors", vendors, 1);
      setCookie("popupCookies", true, 1);
      window.onscroll = function () { };
      document.body.removeChild(popup);
    }

1 użytkowników online, w tym zalogowanych: 0, gości: 1