Jak przechowywać wiele par kluczowych w plikach cookie

Ciasteczka Przechowuj przydatne informacje związane z użytkownikiem, które można pobrać później. Składają się z niewielkich fragmentów danych przechowywanych w przeglądarce internetowej, aby śledzić aktywność użytkownika. Ciasteczka może zawierać tylko jedno „strunowy„Wartość w JavaScript i przechowywanie wiele par kluczowych wymaga wiele plików cookie. Jednak użycie wielu plików cookie może również powodować pewne problemy. Na przykład, jeśli domena Ustawia ciastko limity Jak "10„Wtedy nie możesz przechowywać informacji 11^th użytkownik nowego pliku cookie.

W takich przypadkach stwórz Pojedyncze ciasteczka i przechowuj wiele par wartości kluczy. Takie podejście pomaga w oszczędzaniu podobnych informacji w pliku cookie i oferuje kilka zalet, takich jak zastosowanie daty ważności do wielu par kluczowych jednocześnie.

W tym poście omówiono metody przechowywania wielu par kluczowych w plikach cookie wraz z odpowiednimi przykładami. A więc zacznijmy!

Jak przechowywać wiele par kluczowych w pliku cookie

Zamiast utrzymywać wiele plików cookie, czy jest bardzo korzystne do przechowywania odpowiednich wartości pary kluczowej w jednym pliku cookie; Na przykład, zamiast tworzyć trzy pliki cookie dla „Pełna nazwa”,„Klasa”,„Temat”, Możemy zapisać te pary wartości kluczowej w jednym ciasteczku studenckim.

Jak wspomniano wcześniej, ciasteczka może pomieścić tylko jeden „kluczowa wartość„Para na raz. Jednak, aby zapisać wartości wielokształtne, musisz postępować zgodnie z instrukcjami poniżej podania:

• Stwórz zwyczaj obiekt.
• Konwersja go na ciąg JSON za pomocą „stringify ()" metoda.
• Przechowuj wynik ”dokument.ciastko" obiekt.

Teraz sprawdź poniższy przykład, aby zrozumieć koncepcję za pomocą pojedynczego pliku cookie do przechowywania pary wartości wielokształtnej.

Jak przechowywać wartości w pliku cookie

Po pierwsze, w naszym „indeks.html”Plik, trzy pola wejściowe,„Pełna nazwa”,„Klasa", I "Temat,”Są dodawane, które zaakceptują wejście użytkownika jako odpowiednie wartości pola.

Pełna nazwa:
Klasa:
Temat:

Następnie dodamy dwa przyciski o nazwie: „setCookie" I "Getcookie". „„setCookie”Przycisk wywołuje„setCookie ()”Funkcja, aby ustawić określone wartości w pliku cookie, podczas gdy„Getcookie”Przycisk zadzwoń do„getCookie ()„Funkcja, aby pobrać wartości cookie:

Spójrz na nasze „indeks.html" plik:

W naszym "projekt.JS”Plik, zdefiniujemy„setCookie ()" związany z "na kliknięcie„Wydarzenie„ „setCookie" guziki. „„setCookie ()„Funkcja będzie dostępna do wartości pól wejściowych, wykorzystując„dokument.getElementById ()„Metoda i przechowuj je wszystkie razem w ciągu”Studentinfo". Następnie ciąg „Studentinfo„Wartość zostanie przypisana do„dokument.ciastko„Obiekt, który powoduje tworzenie pliku cookie:

funkcja setCookie ()
var studentinfo = "FullName =" + Dokument.getElementById („FullName”).wartość + "; class =" + dokument.getElementById („klasa”).wartość + "; tematy =" + dokument.getElementById („temat”).wartość;
dokument.cookie = studentinfo;
Alert („COOPIE jest utworzony”);

Zdefiniujemy inną funkcję o nazwie „getCookie ()”W tym samym pliku. „„getCookie ()”Funkcja sprawdzi długość utworzonego pliku cookie w„Jeśli”Instrukcja, a następnie wyświetl utworzone plik cookie w polu alertu. W drugim przypadku, jeśli plik cookie zostanie wygaśnięty lub usunięty, skrzynka alertowa stwierdzi, że „Przepraszam, czy ciasteczka jest niedostępne”:

funkcja getCookie ()
if (dokument.ciastko.długość != 0)
Alert (dokument.ciastko);

w przeciwnym razie
Alert („przepraszam, to ciasteczka niedostępne”)

Oto jak nasze „projekt.JS„Plik wygląda jak:

Zapiszymy oba pliki, a następnie wykorzystamy kod VS „Serwer na żywo”Rozszerzenie uruchomienia aplikacji w przeglądarce:

Wprowadź wartości w „Pełna nazwa”,„Klasa", I "Temat„Pola wejściowe, a następnie kliknij„setCookie" przycisk:

W tym momencie zostanie wygenerowane pole ostrzeżeń, stwierdzając, że „Plik cookie jest tworzony”:

Teraz kliknij „Getcookie”Przycisk do pobrania wielu par kluczowych przyrody utworzonego pliku cookie:

Jak widać z wyjścia, że ​​singiel „kluczowa wartość„Para jest wyświetlana, czyli„FullName = Sharqa”:

Próbowaliśmy przechowywać wiele par kluczowych w pliku cookie; Jednakże "getCookie ()”Funkcja przyciągnęła tylko parę wartości pierwszego klucza. Wynika to z faktu, że pliki cookie JavaScript pozwalają tylko przechowywać pojedynczy ciąg jak para kluczowej wartości w pliku cookie.

W tej sytuacji możesz stworzyć zwyczaj JavaScript obiekt, Następnie przekonwertuj go na String JSON i przechowuj jego wartość (wiele par kluczowych) w pliku cookie. Poniższy przykład wyświetli się, jak wykonać tę operację.

Jak przechowywać wiele par kluczowych w pliku cookie za pomocą JSON

Przejdź do „setCookie ()”Funkcja pliku JavaScript i utwórz niestandardowy obiekt o nazwie„obiekt1". „„obiekt1”Otrzyma wartości dodanych pól wejściowych jako jego właściwości:

funkcja setCookie ()
var object1 = ;
obiekt1.Nazwa = dokument.getElementById („FullName”).wartość;
obiekt1.klasa = dokument.getElementById („klasa”).wartość;
obiekt1.temat = dokument.getElementById („temat”).wartość;

W następnym kroku konwertujemy „obiekt1”Do String JSON z pomocą "stringify ()”Metoda i przechowuj wynikowy ciąg„dokument.ciastko" obiekt:

var jSonstring = JSON.stringify (object1);
dokument.cookie = jSonstring;
Alert („COOPIE jest utworzony”);

Aby odzyskać wiele par klawiszowych przechowywanych jako ciąg w „dokument.ciastko„Obiekt, użyjemy„JSON.analizować()" metoda. „„JSON.analizować()„Metoda będzie analizować„dokument.ciastko„Do Obiekt JSON. Wreszcie, wiele par kluczowych zostanie wyświetlonych w polu alertu:

funkcja getCookie ()
if (dokument.ciastko.długość != 0)
var obj = json.Parse (dokument.ciastko);
alert („fullName =” + obj.Nazwa + "" + "class =" + obj.klasa + "" + „tematy =" + obj.temat);

w przeciwnym razie
alert („ciasteczka niedostępne”);

Teraz ponownie otwórz „indeks.html”Strona w przeglądarce i wprowadź wartości w określonych polach:

Kliknięcie „setCookie„Button poinformuje cię, że tworzono ciasteczka:

W następnym kroku kliknij „Getcookie”Przycisk, który jest obecny obok„setCookie”:

Wygenerowane pole alertu oznacza, że ​​z powodzeniem zapisaliśmy wiele par wartości kluczy w jednym pliku cookie:

Możesz także użyć wielu plików cookie w tym samym celu. Nie zalecamy jednak zastosowania tego podejścia, ponieważ utrzymanie wielu plików cookie jest trudne.

Wniosek

Aby przechowywać wiele par kluczowych w pliku cookie, musisz utworzyć obiekt niestandardowy, Konwertuj to na String JSON z pomocą „stringify ()„Metoda i przechowuj wynik”dokument.ciastko" obiekt. Takie podejście pomaga w oszczędzaniu podobnych informacji w pliku cookie i oferuje kilka korzyści, takich jak zastosowanie daty ważności do wielu par kluczowych jednocześnie. W tym spisie omówiono procedurę sklep wiele par kluczowych W Ciasteczka wraz z odpowiednimi przykładami.