MohirDox

Ko'rinishi

JavaScript Cookielar (Cookie-lar bilan ishlash) ​

Cookie-lar (pechenyelar) — bu veb-sahifalarda foydalanuvchi ma'lumotlarini saqlash imkonini beruvchi kichik matnli fayllardir.

Cookie — bu kompyuteringizda saqlanadigan kichik matnli fayldagi ma'lumotdir.

Veb-server brauzerga veb-sahifani yuborganidan so'ng, aloqa uziladi va server foydalanuvchi haqidagi hamma narsani "unutadi". Cookie-lar "foydalanuvchi haqidagi ma'lumotni qanday eslab qolish kerak?" degan muammoni hal qilish uchun ixtiro qilingan:

  • Foydalanuvchi saytga tashrif buyurganida, uning ismi cookie-da saqlanishi mumkin.
  • Keyingi safar tashrif buyurganida, cookie uning ismini "eslab qoladi".

Cookie-lar nom-qiymat juftligi ko'rinishida saqlanadi: username = John Doe

JavaScript-da document.cookie xususiyati yordamida cookie-larni yaratish, o'qish va o'chirish mumkin.

Oddiy yaratish:

js
document.cookie = 'username=John Doe'

Amal qilish muddati (expiry date) bilan yaratish: Sukut bo'yicha brauzer yopilganda cookie o'chiriladi. Muddatni UTC vaqtida belgilash mumkin:

js
document.cookie = 'username=John Doe; expires=Thu, 18 Dec 2026 12:00:00 UTC'

Path (yo'l) parametri bilan: Cookie qaysi yo'lga tegishli ekanligini ko'rsatish:

js
document.cookie = 'username=John Doe; path=/'

document.cookie barcha cookie-larni bitta satrda qaytaradi:

js
let x = document.cookie
// Natija: cookie1=qiymat; cookie2=qiymat;

Cookie-ni o'zgartirish uni yaratish bilan bir xil. Eskisi yangisi bilan almashtiriladi:

js
document.cookie =
  'username=Steve Jobs; expires=Thu, 18 Dec 2026 12:00:00 UTC; path=/'

O'chirish juda oson — shunchaki muddatni (expires) o'tib ketgan sana bilan belgilang:

js
document.cookie = 'username=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;'

Quyida cookie-larni boshqarish uchun 3 ta asosiy funksiya keltirilgan:

1. Cookie-ni o'rnatish funksiyasi ​

js
function setCookie(cname, cvalue, exdays) {
  const d = new Date()
  d.setTime(d.getTime() + exdays * 24 * 60 * 60 * 1000)
  let expires = 'expires=' + d.toUTCString()
  document.cookie = cname + '=' + cvalue + ';' + expires + ';path=/'
}

2. Cookie qiymatini olish funksiyasi ​

js
function getCookie(cname) {
  let name = cname + '='
  let decodedCookie = decodeURIComponent(document.cookie)
  let ca = decodedCookie.split(';')
  for (let i = 0; i < ca.length; i++) {
    let c = ca[i]
    while (c.charAt(0) == ' ') {
      c = c.substring(1)
    }
    if (c.indexOf(name) == 0) {
      return c.substring(name.length, c.length)
    }
  }
  return ''
}

3. Tekshirish funksiyasi ​

Siz ushbu funksiyani sahifa yuklanganda ishlatishingiz mumkin:

js
function checkCookie() {
  let user = getCookie('username')
  if (user != '') {
    alert('Yana xush kelibsiz, ' + user)
  } else {
    user = prompt('Ismingizni kiriting:', '')
    if (user != '' && user != null) {
      setCookie('username', user, 365)
    }
  }
}

Maslahat

Cookie-lar kichik hajmdagi ma'lumotlar (taxminan 4KB) uchun mo'ljallangan. Agar sizga ko'proq joy kerak bo'lsa, Web Storage API (localStorage) dan foydalanishni tavsiya qilamiz.