JavaScript -koekies
Met koekies kan u gebruikersinligting op webblaaie stoor.
Wat is koekies?
Koekies is data wat in klein tekslêers op jou rekenaar gestoor word.
Wanneer 'n webbediener 'n webblad na 'n blaaier gestuur het, word die verbinding afgeskakel, en die bediener vergeet alles van die gebruiker.
Koekies is uitgevind om die probleem op te los "hoe om inligting oor die gebruiker te onthou":
- Wanneer 'n gebruiker 'n webblad besoek, kan sy/haar naam in 'n koekie gestoor word.
- Volgende keer as die gebruiker die bladsy besoek, "onthou" die koekie sy/haar naam.
Webkoekies word in naam-waarde-pare gestoor soos:
username = John Doe
Wanneer 'n blaaier 'n webblad vanaf 'n bediener versoek, word koekies wat aan die bladsy behoort by die versoek gevoeg. Op hierdie manier kry die bediener die nodige data om inligting oor gebruikers te "onthou".
Geen van die voorbeelde hieronder sal werk as jou blaaier plaaslike koekies-ondersteuning afgeskakel het nie.
Skep 'n koekie met JavaScript
document.cookie
JavaScript kan webkoekies met die eiendom skep, lees en uitvee .
Met JavaScript kan 'n koekie soos volg geskep word:
document.cookie = "username=John Doe";
Jy kan ook 'n vervaldatum (in UTC-tyd) byvoeg. By verstek word die koekie uitgevee wanneer die blaaier gesluit is:
document.cookie = "username=John Doe; expires=Thu, 18 Dec 2013 12:00:00 UTC";
Met 'n padparameter kan jy vir die blaaier sê aan watter pad die koekie behoort. By verstek behoort die koekie aan die huidige bladsy.
document.cookie = "username=John Doe; expires=Thu, 18 Dec 2013 12:00:00 UTC; path=/";
Lees 'n koekie met JavaScript
Met JavaScript kan koekies soos volg gelees word:
let x = document.cookie;
document.cookiesal alle koekies in een string terugstuur, baie soos: koekie1=waarde; koekie2=waarde; koekie3=waarde;
Verander 'n koekie met JavaScript
Met JavaScript kan jy 'n koekie verander op dieselfde manier as wat jy dit skep:
document.cookie = "username=John Smith; expires=Thu, 18 Dec 2013 12:00:00 UTC; path=/";
Die ou koekie word oorgeskryf.
Vee 'n koekie met JavaScript uit
Om 'n koekie uit te vee is baie eenvoudig.
Jy hoef nie 'n koekiewaarde te spesifiseer wanneer jy 'n koekie uitvee nie.
Stel net die verval-parameter op 'n vorige datum:
document.cookie = "username=; expires=Thu, 01
Jan 1970 00:00:00 UTC; path=/;";
Jy moet die koekiepad definieer om te verseker dat jy die regte koekie uitvee.
Sommige blaaiers sal jou nie toelaat om 'n koekie uit te vee as jy nie die pad spesifiseer nie.
Die Koekie String
Die document.cookieeiendom lyk soos 'n gewone teksstring. Maar dit is nie.
Selfs al skryf jy 'n hele koekiestring na document.cookie, wanneer jy dit weer uitlees, kan jy net die naam-waarde-paar daarvan sien.
As jy 'n nuwe koekie instel, word ouer koekies nie oorskryf nie. Die nuwe koekie word by document.cookie gevoeg, so as jy document.cookie weer lees sal jy iets kry soos:
koekie1 = waarde; koekie2 = waarde;
As jy die waarde van een gespesifiseerde koekie wil vind, moet jy 'n JavaScript-funksie skryf wat na die koekiewaarde in die koekiestring soek.
JavaScript-koekie voorbeeld
In die voorbeeld wat volg, sal ons 'n koekie skep wat die naam van 'n besoeker stoor.
Die eerste keer dat 'n besoeker by die webblad aankom, sal hy/sy gevra word om sy/haar naam in te vul. Die naam word dan in 'n koekie gestoor.
Die volgende keer as die besoeker by dieselfde bladsy aankom, sal hy/sy 'n verwelkomingsboodskap kry.
Vir die voorbeeld sal ons 3 JavaScript-funksies skep:
- 'n Funksie om 'n koekiewaarde in te stel
- 'n Funksie om 'n koekiewaarde te kry
- 'n Funksie om 'n koekiewaarde na te gaan
'n Funksie om 'n koekie te stel
Eerstens skep ons 'n functionwat die naam van die besoeker in 'n koekieveranderlike stoor:
Voorbeeld
function setCookie(cname, cvalue, exdays) {
const d = new Date();
d.setTime(d.getTime() + (exdays*24*60*60*1000));
let expires = "expires="+ d.toUTCString();
document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/";
}
Voorbeeld verduidelik:
Die parameters van die funksie hierbo is die naam van die koekie (cname), die waarde van die koekie (cvalue) en die aantal dae totdat die koekie behoort te verval (exdays).
Die funksie stel 'n koekie deur die koekienaam, die koekiewaarde en die vervalstring saam te voeg.
'n Funksie om 'n koekie te kry
Dan skep ons 'n functionwat die waarde van 'n gespesifiseerde koekie terugstuur:
Voorbeeld
function getCookie(cname) {
let name = cname + "=";
let decodedCookie = decodeURIComponent(document.cookie);
let ca = decodedCookie.split(';');
for(let i = 0; i <ca.length; i++) {
let c = ca[i];
while (c.charAt(0) == ' ') {
c = c.substring(1);
}
if (c.indexOf(name) == 0) {
return c.substring(name.length, c.length);
}
}
return "";
}
Funksie verduidelik:
Neem die koekienaam as parameter (cname).
Skep 'n veranderlike (naam) met die teks om na te soek (cname + "=").
Dekodeer die koekiestring om koekies met spesiale karakters te hanteer, bv. '$'
Verdeel document.cookie op kommapunte in 'n skikking genaamd ca (ca = decodedCookie.split(';')).
Loop deur die ca-skikking (i = 0; i < ca.length; i++), en lees elke waarde c = ca[i] uit).
As die koekie gevind word (c.indexOf(name) == 0), gee die waarde van die koekie terug (c.substring(name.length, c.length).
As die koekie nie gevind word nie, stuur "".
'n Funksie om 'n koekie na te gaan
Laastens skep ons die funksie wat kontroleer of 'n koekie gestel is.
As die koekie gestel is, sal dit 'n groet vertoon.
As die koekie nie gestel is nie, sal dit 'n boodskapblokkie vertoon wat die naam van die gebruiker vra, en die gebruikernaamkoekie stoor vir 365 dae, deur die setCookiefunksie te bel:
Voorbeeld
function checkCookie() {
let
username = getCookie("username");
if (username != "") {
alert("Welcome again " + username);
} else {
username = prompt("Please enter your name:", "");
if (username != ""
&& username != null) {
setCookie("username", username, 365);
}
}
}
Almal nou saam
Voorbeeld
function setCookie(cname, cvalue, exdays) {
const d = new Date();
d.setTime(d.getTime() + (exdays * 24 * 60 * 60 * 1000));
let expires = "expires="+d.toUTCString();
document.cookie = cname + "=" + cvalue +
";" + expires + ";path=/";
}
function getCookie(cname) {
let name = cname + "=";
let ca
= document.cookie.split(';');
for(let i = 0; i < ca.length; i++)
{
let c = ca[i];
while (c.charAt(0) == '
') {
c = c.substring(1);
}
if (c.indexOf(name)
== 0) {
return c.substring(name.length, c.length);
}
}
return "";
}
function
checkCookie() {
let user = getCookie("username");
if (user != "")
{
alert("Welcome again " + user);
} else {
user = prompt("Please enter your name:", "");
if (user != "" &&
user != null) {
setCookie("username", user, 365);
}
}
}
Die voorbeeld hierbo loop die checkCookie()funksie wanneer die bladsy laai.