Sobes.tech
Junior

Cookies, sessionStorage va localStorage o'rtasidagi farqni tushuntiring.

sobes.tech AI

AIdan javob

Cookies, sessionStorage va localStorage veb-xotira qilish mexanizmlari bo'lib, maqsad, yashash muddati va saqlanadigan ma'lumot hajmiga ko'ra farq qiladi.

  • Cookies: Veb-server tomonidan yuborilgan va foydalanuvchining brauzerida saqlangan kichik ma'lumot bo'laklari. Ular keyingi so'rov bilan birga yuboriladi. Autentifikatsiya, foydalanuvchi afzalliklarini saqlash, savatcha holatini kuzatish uchun ishlatiladi.

    • Yashash muddati: Yaratuvchida belgilangan (sessiya yoki belgilangan muddati bilan bo'lishi mumkin).
    • Hajm: Cheklangan, odatda bir necha kilobayt (taxminan 4 KB).
  • sessionStorage: Faqat bir sessiya davomida (ochiq bo'lim yoki oynada) ma'lumot saqlaydi. Ma'lumotlar bo'lim yoki oynani yopgach, o'chiriladi.

    • Yashash muddati: Brauzer bo'limi yoki oynasi yopilguncha.
    • Hajm: Ko'pincha cookie'laridan ko'ra katta (odatda bir necha megabayt).
  • localStorage: Muddatsiz ma'lumotlarni saqlaydi, foydalanuvchi yoki skript tomonidan aniq o'chirilmaguncha. Bir domen ichidagi barcha bo'lim va oynalarda mavjud.

    • Yashash muddati: Doimiy (aniq o'chirilmaguncha).
    • Hajm: Ko'pincha cookie'laridan katta (odatda bir necha megabayt).

Mana qisqacha taqqoslash jadvali:

Mexanizm Yashash muddati Mavjudlik Serverga yuboriladi Hajm (odatda) Maqsad
Cookies Sessiya yoki belgilangan muddat HTTP sarlavhalar orqali Ha ~4 KB Autentifikatsiya, kuzatish, afzalliklar
sessionStorage Bo'lim yoki oynani yopguncha JS API orqali Yo'q ~5-10 MB Vaqtinchalik sessiya ma'lumotlarini saqlash
localStorage Muddatsiz (o'chirilguncha) JS API orqali Yo'q ~5-10 MB Uzoq muddatli ma'lumotlarni saqlash

JavaScript API bilan foydalanish misollari:

// Cookies (document.cookie orqali kirish, qo'lda tahlil qilish va serializatsiya qilish talab etiladi)
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(); // Barcha localStorage ma'lumotlarini tozalash