JavaScript i pliki cookie
Co to są pliki cookie?
Przeglądarki i serwery internetowe używają do komunikacji protokołu HTTP, a HTTP jest protokołem bezstanowym. Jednak w przypadku komercyjnej witryny internetowej wymagane jest przechowywanie informacji o sesjach między różnymi stronami. Na przykład jedna rejestracja użytkownika kończy się po wypełnieniu wielu stron. Ale jak zachować informacje o sesjach użytkowników na wszystkich stronach internetowych.
W wielu sytuacjach używanie plików cookie jest najskuteczniejszą metodą zapamiętywania i śledzenia preferencji, zakupów, prowizji i innych informacji wymaganych dla lepszych wrażeń odwiedzających lub statystyk witryny.
Jak to działa ?
Twój serwer wysyła pewne dane do przeglądarki odwiedzającego w formie pliku cookie. Przeglądarka może zaakceptować plik cookie. Jeśli tak, jest przechowywany jako zwykły zapis tekstowy na dysku twardym gościa. Teraz, gdy użytkownik przejdzie na inną stronę w Twojej witrynie, przeglądarka wysyła ten sam plik cookie do serwera w celu pobrania. Po odzyskaniu serwer wie / pamięta, co zostało zapisane wcześniej.
Pliki cookie to zapis danych w postaci zwykłego tekstu składający się z 5 pól o zmiennej długości -
Expires- data wygaśnięcia pliku cookie. Jeśli pole jest puste, plik cookie wygaśnie, gdy odwiedzający zamknie przeglądarkę.
Domain - nazwa domeny Twojej witryny.
Path- Ścieżka do katalogu lub strony internetowej, która ustawiła plik cookie. To może być puste, jeśli chcesz pobrać plik cookie z dowolnego katalogu lub strony.
Secure- Jeśli to pole zawiera słowo „bezpieczne”, plik cookie można pobrać tylko z bezpiecznego serwera. Jeśli to pole jest puste, takie ograniczenie nie istnieje.
Name=Value - Pliki cookie są ustawiane i pobierane w postaci par klucz-wartość
Pliki cookie zostały pierwotnie zaprojektowane do programowania CGI. Dane zawarte w pliku cookie są automatycznie przesyłane między przeglądarką internetową a serwerem internetowym, dzięki czemu skrypty CGI na serwerze mogą odczytywać i zapisywać wartości plików cookie, które są przechowywane na kliencie.
JavaScript może również manipulować plikami cookie za pomocą rozszerzenia cookie właściwość Documentobiekt. JavaScript może czytać, tworzyć, modyfikować i usuwać pliki cookie dotyczące bieżącej strony internetowej.
Przechowywanie plików cookie
Najprostszym sposobem utworzenia pliku cookie jest przypisanie wartości ciągu do obiektu document.cookie, który wygląda następująco.
document.cookie = "key1 = value1;key2 = value2;expires = date";Tutaj expiresatrybut jest opcjonalny. Jeśli podasz temu atrybutowi prawidłową datę lub godzinę, plik cookie wygaśnie w określonym dniu lub godzinie, a po tym czasie wartość plików cookie nie będzie dostępna.
Note- Wartości plików cookie nie mogą zawierać średników, przecinków ani spacji. Z tego powodu możesz chcieć użyć JavaScriptescape()funkcja do zakodowania wartości przed zapisaniem jej w pliku cookie. Jeśli to zrobisz, będziesz musiał również użyć odpowiedniego plikuunescape() działa po odczytaniu wartości pliku cookie.
Przykład
Spróbuj wykonać następujące czynności. Ustawia nazwę klienta w wejściowym pliku cookie.
<html>
<head>
<script type = "text/javascript">
<!--
function WriteCookie() {
if( document.myform.customer.value == "" ) {
alert("Enter some value!");
return;
}
cookievalue = escape(document.myform.customer.value) + ";";
document.cookie = "name=" + cookievalue;
document.write ("Setting Cookies : " + "name=" + cookievalue );
}
//-->
</script>
</head>
<body>
<form name = "myform" action = "">
Enter name: <input type = "text" name = "customer"/>
<input type = "button" value = "Set Cookie" onclick = "WriteCookie();"/>
</form>
</body>
</html>Wynik
Teraz Twoja maszyna ma plik cookie o nazwie name. Możesz ustawić wiele plików cookie, używając wielu par klucz = wartość oddzielonych przecinkami.
Czytanie plików cookie
Odczytywanie pliku cookie jest tak samo proste, jak jego pisanie, ponieważ wartością obiektu document.cookie jest plik cookie. Możesz więc użyć tego ciągu, gdy chcesz uzyskać dostęp do pliku cookie. Ciąg document.cookie zachowa listę par nazwa = wartość oddzielonych średnikami, gdziename to nazwa pliku cookie, a wartość to jego wartość w postaci ciągu znaków.
Możesz użyć ciągów split() funkcja, aby podzielić ciąg na klucz i wartości w następujący sposób -
Przykład
Wypróbuj poniższy przykład, aby pobrać wszystkie pliki cookie.
<html>
<head>
<script type = "text/javascript">
<!--
function ReadCookie() {
var allcookies = document.cookie;
document.write ("All Cookies : " + allcookies );
// Get all the cookies pairs in an array
cookiearray = allcookies.split(';');
// Now take key value pair out of this array
for(var i=0; i<cookiearray.length; i++) {
name = cookiearray[i].split('=')[0];
value = cookiearray[i].split('=')[1];
document.write ("Key is : " + name + " and Value is : " + value);
}
}
//-->
</script>
</head>
<body>
<form name = "myform" action = "">
<p> click the following button and see the result:</p>
<input type = "button" value = "Get Cookie" onclick = "ReadCookie()"/>
</form>
</body>
</html>Note - Tutaj length jest metodą Arrayklasa, która zwraca długość tablicy. Tablice omówimy w osobnym rozdziale. Do tego czasu spróbuj to strawić.
Note- Na komputerze mogą być już ustawione inne pliki cookie. Powyższy kod wyświetli wszystkie pliki cookie ustawione na Twoim komputerze.
Ustawianie daty wygaśnięcia plików cookie
Możesz przedłużyć żywotność pliku cookie poza bieżącą sesję przeglądarki, ustawiając datę wygaśnięcia i zapisując datę wygaśnięcia w pliku cookie. Można to zrobić, ustawiając plik‘expires’ atrybut do daty i godziny.
Przykład
Wypróbuj następujący przykład. Pokazuje, jak przedłużyć datę ważności pliku cookie o 1 miesiąc.
<html>
<head>
<script type = "text/javascript">
<!--
function WriteCookie() {
var now = new Date();
now.setMonth( now.getMonth() + 1 );
cookievalue = escape(document.myform.customer.value) + ";"
document.cookie = "name=" + cookievalue;
document.cookie = "expires=" + now.toUTCString() + ";"
document.write ("Setting Cookies : " + "name=" + cookievalue );
}
//-->
</script>
</head>
<body>
<form name = "myform" action = "">
Enter name: <input type = "text" name = "customer"/>
<input type = "button" value = "Set Cookie" onclick = "WriteCookie()"/>
</form>
</body>
</html>Wynik
Usuwanie pliku cookie
Czasami będziesz chciał usunąć plik cookie, aby kolejne próby odczytu pliku cookie nic nie zwracały. Aby to zrobić, wystarczy ustawić datę ważności na godzinę z przeszłości.
Przykład
Wypróbuj następujący przykład. Pokazuje, jak usunąć plik cookie, ustawiając jego datę wygaśnięcia na jeden miesiąc za bieżącą datą.
<html>
<head>
<script type = "text/javascript">
<!--
function WriteCookie() {
var now = new Date();
now.setMonth( now.getMonth() - 1 );
cookievalue = escape(document.myform.customer.value) + ";"
document.cookie = "name=" + cookievalue;
document.cookie = "expires=" + now.toUTCString() + ";"
document.write("Setting Cookies : " + "name=" + cookievalue );
}
//-->
</script>
</head>
<body>
<form name = "myform" action = "">
Enter name: <input type = "text" name = "customer"/>
<input type = "button" value = "Set Cookie" onclick = "WriteCookie()"/>
</form>
</body>
</html>