Vysvetlite rozdiel medzi cookies, sessionStorage a localStorage.

Oblasť viditeľnosti: cookies sú dostupné ako na strane klienta, tak aj na strane servera. sessionStorage a localStorage sú dostupné iba na strane klienta.

Doba života: Pre cookies sa doba života nastavuje pri vytváraní (pomocou atribútu expires alebo max-age). Ak nie je uvedené, cookie sa odstráni pri zatvorení prehliadača. sessionStorage uchováva údaje iba počas aktuálnej relácie (do zatvorenia karty alebo okna). localStorage uchováva údaje bez časového obmedzenia, kým nie sú výslovne odstránené.

Veľkosť: Maximálna veľkosť pre cookies je približne 4 KB. Pre sessionStorage a localStorage — od 5 MB do 10 MB, v závislosti od prehliadača.

Odosielanie s každým požiadavkom: Cookies sa automaticky odosielajú s každým HTTP požiadavkom na doménu, pre ktorú sú nastavené, čo môže zvýšiť prenos. Dáta v sessionStorage a localStorage sa neodosielajú na server.

Spôsob prístupu: Prístup k cookies sa vykonáva cez document.cookie (reťazec). Prístup k sessionStorage a localStorage sa vykonáva cez príslušné objekty s použitím metód setItem, getItem, removeItem a clear.

// Nastavenie cookie
document.cookie = "username=John Doe; expires=Thu, 18 Dec 2023 12:00:00 UTC; path=/";

// Získanie cookie
let x = document.cookie;

// Nastavenie dát do sessionStorage
sessionStorage.setItem("lastname", "Smith");

// Získanie dát z sessionStorage
let y = sessionStorage.getItem("lastname");

// Nastavenie dát do localStorage
localStorage.setItem("firstname", "Jane");

// Získanie dát z localStorage
let z = localStorage.getItem("firstname");

Funkcia	cookies	sessionStorage	localStorage
Oblasť viditeľnosti	Klient a server	Iba klient	Iba klient
Doba platnosti	Nastavuje sa pri vytvorení (expires/max-age), inak do zatvorenia prehliadača	Do zatvorenia záložky alebo okna	Bez časového obmedzenia (kým nie je výslovne odstránené)
Veľkosť	~4 KB	~5-10 MB (závisí od prehliadača)	~5-10 MB (závisí od prehliadača)
Odosielanie s požiadavkou	Áno	Nie	Nie
Prístup	document.cookie	sessionStorage.getItem/setItem	localStorage.getItem/setItem