Објасните разлику између cookies, sessionStorage и localStorage.
sobes.tech АИ
Одговор од АИ
Cookies, sessionStorage и localStorage су механизми за веб складиштење, који се разликују по намени, року трајања и обиму сачуваних података.
-
Колачићи: Мали делови података, које веб сервер шаље и чува на рачунару корисника преко веб прегледача. Шаљу се са сваким следећим захтевом ка истом серверу. Користе се за аутентификацију, чување корисничких преференци, праћење стања корпе за куповину.
- Рок трајања: Дефинише се приликом креирања (може бити сесијски или са одређеним роком истека).
- Обим: Ограничен, обично неколико килобајта (око 4 KB).
-
sessionStorage: Чува податке само за једну сесију прегледача (отворени таб или прозор). Податци се бришу при затварању таба или прозора.
- Рок трајања: До затварања таба или прозора.
- Обим: Значајно већи од колачића (обично неколико мегабајта).
-
localStorage: Чува податке без рока трајања, све док их корисник или сценарио изричито не избришу. Доступан је у свим табовима и прозорима исте домене.
- Рок трајања: Стално (до изричитог брисања).
- Обим: Значајно већи од колачића (обично неколико мегабајта).
Ево кратког поређења:
| Механизам | Рок трајања | Доступност | Пошаљује серверу | Обим (типично) | Намена |
|---|---|---|---|---|---|
| Cookies | Сесијски или са истеком рока | Преко HTTP заглавља | Да | ~4 KB | Аутентификација, праћење, преференце |
| sessionStorage | До затварања таба/прозора | Преко JS API | Не | ~5-10 MB | Временско чување података сесије |
| localStorage | Стално (до брисања) | Преко JS API | Не | ~5-10 MB | Дугорочно чување података |
Примери коришћења JavaScript API:
// Cookies (доступне преко document.cookie, захтевају ручно парсирање и серијализацију)
document.cookie = "username=John Doe; expires=Thu, 18 Dec 2023 12:00:00 UTC; path=/";
// sessionStorage
sessionStorage.setItem('id', '123');
let userId = sessionStorage.getItem('id');
sessionStorage.removeItem('id');
// localStorage
localStorage.setItem('theme', 'dark');
let userTheme = localStorage.getItem('theme');
localStorage.removeItem('theme');
localStorage.clear(); // Бриса све податке у localStorage