Cookies umożliwiają przechowywanie informacji użytkownika na stronach internetowych.
Co to są Cookies ?
Cookies są to dane, przechowywane w małych plików tekstowych na komputerze.
Gdy serwer WWW wysłał stronę internetową w przeglądarce, połączenie zostanie zamknięte, a serwer zapomina wszystko o użytkowniku.
Cookies zostały wymyślone, aby rozwiązać problem "jak do zapamiętania informacji o użytkowniku":
- Gdy użytkownik odwiedza stronę internetową, jego nazwa może być przechowywany w cookie .
- Następnym razem, gdy użytkownik odwiedza stronę, odbiornik cookie "pamięta" swoje nazwisko.
Cookies są zapisywane w parach nazwa-wartość, takich jak:
username = John Doe
Gdy żądanie przeglądarki strona internetowa z serwera, cookies należące do tej strony zostanie dodany do wniosku. W ten sposób serwer pobiera dane niezbędne do "zapamiętania" informacji o użytkownikach.
Tworzenie a Cookie z JavaScript
JavaScript może tworzyć, czytać i usuwać cookies z document.cookie nieruchomości.
Z JavaScript, a cookie mogą być tworzone w następujący sposób:
document.cookie = "username=John Doe";Można również dodać datę ważności (w czasie UTC). Domyślnie the cookie są usuwane po zamknięciu przeglądarki:
document.cookie = "username=John Doe; expires=Thu, 18 Dec 2013 12:00:00 UTC";Z parametrem ścieżki, można powiedzieć przeglądarkę jaką ścieżkę the cookie należy. Domyślnie the cookie należący do bieżącej strony.
document.cookie = "username=John Doe; expires=Thu, 18 Dec 2013 12:00:00 UTC; path=/";Czytaj a Cookie z JavaScript
Z JavaScript, cookies można odczytać tak:
var x = document.cookie;document.cookie zwróci wszystkie cookies w jednym ciągiem dużo jak: cookie1=value; cookie2=value; cookie3=value; cookie1=value; cookie2=value; cookie3=value;
Zmień a Cookie z JavaScript
Z JavaScript, można zmienić a cookie w ten sam sposób, jak go utworzyć:
document.cookie = "username=John Smith; expires=Thu, 18 Dec 2013 12:00:00 UTC; path=/";
Stary cookie zostanie zastąpiony.
Usuń a Cookie z JavaScript
Usuwanie a cookie jest bardzo prosta. Wystarczy ustawić wygasa parametr przekazany do daty:
document.cookie = "username=; expires=Thu, 01
Jan 1970 00:00:00 UTC";
Zauważ, że nie trzeba określać a cookie wartość po usunięciu a cookie .
Cookie String
document.cookie Obiekt wygląda jak zwykły ciąg tekstowy. Ale to nie jest.
Nawet jeśli napisać całą cookie ciąg document.cookie , kiedy ponownie przeczytać go można zobaczyć tylko parę nazwa-wartość tego.
Jeśli ustawisz nowy cookie , starsze cookies nie są nadpisywane. Nowy cookie jest dodawany do document.cookie , więc jeśli czytasz document.cookie znów dostaniesz coś takiego:
cookie1 = value; cookie2 = value;
Jeśli chcesz znaleźć wartość jednego określonego cookie , należy napisać funkcję JavaScript, która wyszukuje cookie wartości w cookie ciąg.
JavaScript Cookie Przykład
Na przykład do naśladowania, będziemy tworzyć a cookie , które przechowuje nazwę użytkownika.
Za pierwszym razem, gdy użytkownik wchodzi na stronę internetową, zostanie poproszony o wypełnienie w jego imieniu. Nazwa jest następnie przechowywany w a cookie .
Następnym razem, gdy użytkownik wchodzi na tej samej stronie, otrzyma wiadomość powitalną.
Dla przykładu stworzymy 3 funkcje JavaScript:
- Funkcja ustawić cookie wartości
- Funkcja dostać cookie wartości
- Funkcja do sprawdzania cookie wartość
Funkcję do ustawienia a Cookie
Po pierwsze, możemy utworzyć funkcję, która przechowuje nazwę użytkownika w a cookie zmiennej:
Przykład
function setCookie(cname, cvalue, exdays) {
var d = new Date();
d.setTime(d.getTime() + (exdays*24*60*60*1000));
var
expires = "expires="+ d.toUTCString();
document.cookie =
cname + "=" + cvalue + "; " + expires;
}
Przykład wyjaśnił:
Parametry funkcji powyżej to nazwa cookie (cname) , wartość the cookie (cvalue) i liczby dni, aż ciasteczka powinny wygasnąć (exdays).
Funkcja ustawia a cookie poprzez zsumowanie cookiename , the cookie wartość, a wygasa ciąg.
Funkcję Get a Cookie
Następnie tworzymy funkcję, która zwraca wartość określonego cookie :
Przykład
function getCookie(cname) {
var name = cname + "=";
var ca = document.cookie.split(';');
for(var i = 0; i <ca.length; i++) {
var c = ca[i];
while (c.charAt(0)=='
') {
c = c.substring(1);
}
if (c.indexOf(name) == 0) {
return c.substring(name.length,c.length);
}
}
return "";
}
Funkcja wyjaśnił:
Weźmy the cookiename jako parametr (CNAME).
Tworzenie zmiennej (nazwę) z tekstem, aby szukać (CNAME + "=").
Podział document.cookie na średnikami do tablicy o nazwie ca (ca = document.cookie.split(';')) .
Pętla przez ca array (i=0;i<ca.length;i++) i odczytać każdą wartość c=ca[i]) .
Jeśli the cookie zostanie znaleziony (c.indexOf(name) == 0) , zwraca wartość the cookie (c.substring(name.length,c.length) .
Jeśli the cookie nie zostanie znaleziony, wrócić "".
Funkcję, aby sprawdzić a Cookie
Ostatni, tworzymy funkcję, która checks , czy a cookie jest ustawiony.
Jeśli the cookie jest ustawiony to wyświetla powitanie.
Jeśli the cookie nie jest ustawiona, wyświetli się okno wiersza, z prośbą o podanie nazwy użytkownika i przechowuje nazwę użytkownika cookie przez 365 dni, wywołując setCookie funkcję:
Przykład
function checkCookie() {
var
username=getCookie("username");
if (username!="") {
alert("Welcome again " + username);
} else {
username = prompt("Please enter your name:", "");
if (username != ""
&& username != null) {
setCookie("username", username, 365);
}
}
}
Teraz wszyscy razem
Przykład
function setCookie(cname, cvalue, exdays) {
var d = new Date();
d.setTime(d.getTime() + (exdays*24*60*60*1000));
var expires = "expires="+d.toUTCString();
document.cookie = cname + "=" + cvalue +
"; " + expires;
}
function getCookie(cname) {
var name = cname + "=";
var ca
= document.cookie.split(';');
for(var i = 0; i < ca.length; i++)
{
var 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() {
var user = getCookie("username");
if (user != "")
{
alert("Welcome again " + user);
} else {
user = prompt("Please enter your name:", "");
if (user != "" &&
user != null) {
setCookie("username", user, 365);
}
}
} Spróbuj sam " Powyższy przykład uruchamia checkCookie() działa, gdy strona się ładuje.