Hvordan lagre flere nøkkelverdipar i informasjonskapsler

Informasjonskapsler Oppbevar nyttig informasjon relatert til brukeren som kan hentes senere. De består av små biter av data som holdes i en nettleser for å spore brukeraktivitet. En informasjonskapsel kan bare inneholde en "streng”Verdi i JavaScript, og lagring Flere nøkkelverdipar krever Flere informasjonskapsler. Å bruke flere informasjonskapsler kan imidlertid også forårsake noen problemer. For eksempel hvis en domene Angir informasjonskapselen grenser som "10“Da kan du ikke lagre informasjonen til 11^th Bruker i en ny informasjonskapsel.

I slike tilfeller, lage en enkeltkake og lagre flere nøkkelverdipar. Denne tilnærmingen hjelper til.

Dette innlegget diskuterer metodene for å lagre flere nøkkelverdipar i informasjonskapsler sammen med passende eksempler. Så la oss starte!

Hvordan lagre flere nøkkelverdipar i en informasjonskapsel

I stedet for å opprettholde flere informasjonskapsler, er det veldig gunstig å lagre relevante nøkkelparverdier i en enkelt informasjonskapsel; For eksempel, i stedet for å lage tre informasjonskapsler for “Fullt navn”,“Klasse”,“Emne”, Vi kan lagre disse nøkkelverdiparene i en enkelt studentkake.

Som nevnt tidligere, kan en informasjonskapsel bare holde en enkelt “nøkkelverdi”Par om gangen. For å lagre flere nøkkelverdier, må du imidlertid følge de undergitte instruksjonene:

• Lage en tilpasset gjenstand.
• Konverter den til en JSON -streng ved hjelp av “Stringify ()”Metode.
• Lagre det resulterende “dokument.kjeks”Objekt.

Nå, sjekk ut følgende eksempel for å forstå konseptet bak å bruke en enkelt informasjonskapsel for å lagre par med flere nøkkelverdier.

Hvordan lagre verdier i en informasjonskapsel

Først av alt, i vår “indeks.html”Fil, tre inngangsfelt,”Fullt navn”,“Klasse”, Og“Emne,”Legges til, som vil akseptere brukerinngangen som de respektive feltverdiene.

Fullt navn:
Klasse:
Emne:

Deretter vil vi legge til to knapper som heter: “setcookie”Og“Getcookie”. “setcookie”-Knappen påkaller“setcookie ()”Funksjon for å angi de spesifiserte verdiene i en informasjonskapsel, mens“Getcookie”Knapp ring“GetCookie ()”Funksjon for å hente kakeverdiene:

Ta en titt på vår “indeks.html”Fil:

I vår "prosjekt.JS”Fil, vi vil definere“setcookie ()”Assosiert med“ved trykk”Hendelse av“setcookie”Knapper. “setcookie ()”Funksjon vil få tilgang til verdiene til inngangsfeltene ved å bruke“dokument.getElementById ()”Metode og lagre dem alle sammen i en streng”StudentInfo”. Så strengen "StudentInfo”Verdien vil bli tilordnet“dokument.kjeks”Objekt, som resulterer i å lage en informasjonskapsel:

funksjon setCookie ()
var studentInfo = "fullname =" + dokument.getElementById ("Fullname").verdi + "; class =" + dokument.getElementById ("klasse").verdi + "; emne =" + dokument.getElementById ("Emne").verdi;
dokument.Cookie = StudentInfo;
Varsel ("Cookie er opprettet");

Vi vil definere en annen funksjon som heter “GetCookie ()”I samme fil. “GetCookie ()”Funksjonen vil sjekke lengden på den opprettede informasjonskapselen i“hvis”Uttalelse, og vis deretter den opprettede informasjonskapselen i en varslingsboks. I det andre tilfellet, hvis informasjonskapselen blir utløpt eller slettet, vil varslingsboksen oppgi at "Beklager, er ikke cookie ikke tilgjengelig”:

funksjon getCookie ()
hvis (dokument.kjeks.lengde != 0)
Varsel (dokument.kjeks);

annet
Varsel ("Beklager, er ikke tilgjengelig")

Slik er vår “prosjekt.JS”Fil ser ut som:

Vi lagrer begge filene og bruker deretter VS -koden “Live server”Utvidelse for å kjøre applikasjonen i nettleseren:

Angi verdier i “Fullt navn”,“Klasse”, Og“Emne”Inngangsfelt og klikk deretter på“setcookie”Knapp:

En varslingsboks vil bli generert på dette tidspunktet som sier at en “Cookie er opprettet”:

Nå, klikk på “Getcookie”-Knappen for å hente flere nøkkelverdipar av den opprettede informasjonskapselen:

Som du kan se av utgangen som en enkelt “nøkkelverdi”Par vises, som er“Fullname = sharqa”:

Vi har prøvd å lagre flere nøkkelverdipar i en informasjonskapsel; Imidlertid "GetCookie ()”Funksjon hentet bare første nøkkelverdiparet. Dette er fordi JavaScript -informasjonskapsler bare tillater deg å lagre en enkelt streng som en Nøkkelverdipar i en informasjonskapsel.

I denne situasjonen kan du lage en tilpasset JavaScript gjenstand, deretter konvertere den til en JSON -streng og lagre verdien (flere nøkkelverdipar) i en informasjonskapsel. Det undergitte eksemplet vil demonstrere hvordan du utfører denne operasjonen.

Hvordan lagre flere nøkkelverdipar i en informasjonskapsel ved hjelp av JSON

Flytt inn i “setcookie ()”Funksjonen til JavaScript -filen og opprette et tilpasset objekt som heter“Objekt1”. “Objekt1”Vil få verdiene til de ekstra inngangsfeltene som dens egenskaper:

funksjon setCookie ()
var objekt1 = ;
Objekt1.Navn = dokument.getElementById ("Fullname").verdi;
Objekt1.klasse = dokument.getElementById ("klasse").verdi;
Objekt1.emne = dokument.getElementById ("Emne").verdi;

I neste trinn vil vi konvertere “Objekt1”Til en JSON -streng med hjelp av "Stringify ()”Metode og lagre den resulterende strengen”dokument.kjeks”Objekt:

var jsonstring = json.Stringify (Object1);
dokument.cookie = jsonstring;
Varsel ("Cookie er opprettet");

For å hente det flere nøkkelverdiparene som er lagret som en streng i “dokument.kjeks”Objekt, vi vil bruke“JSON.parse ()”Metode. “JSON.parse ()”Metoden vil analysere“dokument.kjeks" inn i en JSON -objekt. Til slutt vises flere nøkkelverdipar i en varslingsboks:

funksjon getCookie ()
hvis (dokument.kjeks.lengde != 0)
var obj = json.analyser (dokument.kjeks);
Varsel ("fullname =" + obj.Navn + "" + "klasse =" + obj.klasse + "" + "emne =" + obj.Emne);

annet
Varsel ("Cookie ikke tilgjengelig");

Nå, åpner igjen "indeks.html”Side i nettleseren og skriv inn verdier i de spesifiserte feltene:

Klikk på “setcookie”Button vil gi deg beskjed om at det opprettes en informasjonskapsel:

I neste trinn klikker du på "Getcookie”-Knappen, som er til stede ved siden av“setcookie”:

Den genererte varslingsboksen betyr at vi har lagret flere nøkkelverdipar i en enkelt informasjonskapsel:

Du kan også bruke flere informasjonskapsler til samme formål. Vi anbefaler imidlertid ikke at du bruker denne tilnærmingen, da den gjør det utfordrende å opprettholde flere informasjonskapsler.

Konklusjon

For å lagre flere nøkkelverdipar i en informasjonskapsel, må du opprette en Tilpasset objekt, konvertere den til en JSON -streng ved hjelp av “Stringify ()”Metode, og lagre den resulterende”dokument.kjeks”Objekt. Denne tilnærmingen hjelper til. Denne oppskrivningen diskuterte prosedyren til butikk Flere nøkkelverdipar i Informasjonskapsler sammen med de passende eksemplene.