Cookies, sessionStorage və localStorage arasındakı fərqi izah edin.

Cookies, sessionStorage və localStorage veb yaddaş mexanizmləridir və məqsəd, istifadə müddəti və saxlanılan məlumatların həcminə görə fərqlənirlər.

• Cookies: Veb server tərəfindən göndərilən və istifadəçinin brauzerində saxlanılan kiçik məlumat parçalarıdır. Hər növbəti sorğuda eyni serverə göndərilir. Doğrulama, istifadəçi üstünlüklərinin saxlanması, alış-veriş səbətinin vəziyyətinin izlənməsi üçün istifadə olunur.

  • Müddət: Yaradılarkən təyin edilir (sessiya və ya müəyyən bir bitmə tarixi ola bilər).
  • Həcmi: Məhduddur, adətən bir neçə kilobayt (təxminən 4 KB).

• sessionStorage: Yalnız bir brauzer sessiyası üçün məlumat saxlayır (açıq tab və ya pəncərə). Tab və ya pəncərə bağlandıqda məlumatlar silinir.

  • Müddət: Brauzer tab və ya pəncərə bağlanana qədər.
  • Həcmi: Cookies-dən çox daha böyükdür (adətən bir neçə megabayt).

• localStorage: Bitmə tarixi olmadan məlumat saxlayır, istifadəçi və ya skript tərəfindən açıq şəkildə silinənə qədər. Eyni domen daxilində bütün tab və pəncərələrdə mövcuddur.

  • Müddət: Daimi (açıq şəkildə silinənə qədər).
  • Həcmi: Cookies-dən çox daha böyükdür (adətən bir neçə megabayt).

Qısa müqayisə:

Mexanizm	Müddət	Mövcudluq	Serverə göndərilir	Həcmi (tipik)	Məqsəd
Cookies	Sessiya və ya bitmə tarixi	HTTP başlıqları vasitəsilə	Bəli	~4 KB	Doğrulama, izləmə, üstünlüklər
sessionStorage	Tab və ya pəncərə bağlanana qədər	JS API vasitəsilə	Xeyr	~5-10 MB	Müvəqqəti sessiya məlumatlarının saxlanması
localStorage	Daimi (silinənə qədər)	JS API vasitəsilə	Xeyr	~5-10 MB	Uzunmüddətli məlumatların saxlanması

JavaScript API ilə istifadə nümunələri:

// Cookies (document.cookie vasitəsilə əldə edilir, əl ilə parsinq və serializasiya tələb edir)
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(); // Bütün localStorage məlumatlarını silir