JavaScript
Wyszukiwarka
Wprowadzenie do JavaScript
Podstawy języka JavaScript
Zmienne i typy danych
Pętle i instrukcje warunkowe
Podstawy funkcji
Obiekty i tablice
Obsługa formularzy i edycja elementów
Cookies
Zarządzanie cookies i usuwanie danych
Ciasteczka (cookies) pozwalają przeglądarce przechowywać dane między kolejnymi wizytami na stronie. W codziennej praktyce JavaScript możesz je ustawiać, odczytywać i usuwać, a zatem zarządzać nimi tak, by zapamiętywały preferencje użytkownika czy informacje sesyjne.
Podstawy zarządzania cookies w JS
- Ustawianie ciasteczka
- document.cookie = "nazwa=wartosc; path=/; expires=..."
- Parametry takie jak path, expires (lub max-age) określają ważność i zasięg.
- Odczytywanie
- document.cookie zwraca wszystkie ciasteczka w jednym ciągu znaków, np. "imie=Ala; token=abc123".
- Potrzebna jest najczęściej mała funkcja pomocnicza, by wyłuskać pojedynczą wartość.
- Usuwanie
- Ustaw wartość cookie na pustą, z datą wygaśnięcia w przeszłości lub max-age=0.
- document.cookie = "nazwa=; path=/; max-age=0";
Przykład
// Ustawia ciasteczko o danej nazwie i wartości na określony czas (days)
function setCookie(name, value, days) {
const d = new Date();
d.setTime(d.getTime() + (days * 24 * 60 * 60 * 1000));
const expires = "expires=" + d.toUTCString();
document.cookie = name + "=" + encodeURIComponent(value) + ";" + expires + ";path=/";
}
// Odczytuje wartość ciasteczka o podanej nazwie
function getCookie(name) {
const nameEQ = name + "=";
const ca = document.cookie.split(';');
for (let i = 0; i < ca.length; i++) {
let c = ca[i].trim();
if (c.indexOf(nameEQ) === 0) {
return decodeURIComponent(c.substring(nameEQ.length, c.length));
}
}
return null;
}
// Usuwa ciasteczko o podanej nazwie
function removeCookie(name) {
// Ustawiamy datę ważności w przeszłości
document.cookie = name + "=; path=/; max-age=0";
}
Podsumowanie
- Zarządzanie cookies polega głównie na umiejętnym ustawianiu ich wartości i daty ważności, a także na ich odczycie i usuwaniu w razie potrzeby.
- Ustawianie (setCookie) – klucz, wartość, data wygaśnięcia (expires lub max-age) i ścieżka (path).
- Odczyt (getCookie) – trzeba przeanalizować document.cookie, który zawiera wszystkie ciasteczka w jednym ciągu.
- Usuwanie (removeCookie) – ustaw wartość na pustą i wygaśnięcie w przeszłości (max-age=0).
- W praktycznych projektach można sięgnąć po biblioteki (np. js-cookie), by te operacje były jeszcze wygodniejsze i mniej podatne na błędy.