JavaScript'da Cookies

Cookies veb-dasturlashda keng qo'llaniladigan mexanizm bo'lib, foydalanuvchi ma'lumotlarini saqlash va kuzatib borish uchun ishlatiladi. Ushbu qo'llanma JavaScript'da cookies bilan ishlashning barcha jihatlarini qamrab oladi.

Cookies Nima?

Cookies - bu veb-server tomonidan foydalanuvchining brauzeriga yuborilgan va keyinchalik so'rovlar bilan qayta yuborilishi mumkin bo'lgan kichik ma'lumot qismlaridir. Ular foydalanuvchi seansini kuzatib borish, shaxsiy sozlamalarni saqlash va boshqa ko'plab maqsadlar uchun ishlatiladi.

Cookies Yaratish va O'rnatish

JavaScript'da cookies yaratish va o'rnatish uchun document.cookie xususiyatidan foydalaniladi:

function setCookie(name, value, days) {
    let expires = "";
    if (days) {
        const date = new Date();
        date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
        expires = "; expires=" + date.toUTCString();
    }
    document.cookie = name + "=" + (value || "")  + expires + "; path=/";
}

// Foydalanish
setCookie("username", "John Doe", 7);

Bu funksiya cookie nomini, qiymatini va amal qilish muddatini (kunlarda) qabul qiladi.

Cookies'larni O'qish

Cookies'larni o'qish uchun document.cookie xususiyatini tahlil qilish kerak:

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

// Foydalanish
const username = getCookie("username");
console.log(username);  // "John Doe"

Cookies'larni O'zgartirish

Cookies'ni o'zgartirish uchun, shunchaki yangi qiymat bilan qayta o'rnatish kerak:

setCookie("username", "Jane Doe", 7);  // "username" cookie'sini yangilash

Cookies'larni O'chirish

Cookies'ni o'chirish uchun, uning amal qilish muddatini o'tgan sana bilan qayta o'rnatish kerak:

function deleteCookie(name) {
    document.cookie = name + '=; Path=/; Expires=Thu, 01 Jan 1970 00:00:01 GMT;';
}

// Foydalanish
deleteCookie("username");

Cookies Xususiyatlari

Cookies bir nechta muhim xususiyatlarga ega:

1. Expires/Max-Age: Cookie'ning amal qilish muddati.
2. Domain: Cookie qaysi domainlarga yuborilishi kerakligini belgilaydi.
3. Path: Cookie qaysi URL yo'llariga yuborilishi kerakligini belgilaydi.
4. Secure: Cookie'ni faqat HTTPS orqali yuborish kerakligini belgilaydi.
5. HttpOnly: JavaScript orqali cookie'ga kirishni taqiqlaydi.
6. SameSite: Cross-site so'rovlar uchun cookie'larni yuborishni boshqaradi.

Misol:

function setAdvancedCookie(name, value, options = {}) {
    options = {
        path: '/',
        ...options
    };

    if (options.expires instanceof Date) {
        options.expires = options.expires.toUTCString();
    }

    let updatedCookie = encodeURIComponent(name) + "=" + encodeURIComponent(value);

    for (let optionKey in options) {
        updatedCookie += "; " + optionKey;
        let optionValue = options[optionKey];
        if (optionValue !== true) {
            updatedCookie += "=" + optionValue;
        }
    }

    document.cookie = updatedCookie;
}

// Foydalanish
setAdvancedCookie("user", "John", {
    'max-age': 3600,
    'secure': true,
    'samesite': 'Strict'
});

Xavfsizlik Masalalari

Cookies bilan ishlashda xavfsizlik juda muhim:

1. Sezgir ma'lumotlarni saqlash: Hech qachon parollar yoki boshqa muhim ma'lumotlarni cookie'larda saqlamang.
2. XSS (Cross-Site Scripting) hujumlaridan himoya: Foydalanuvchi kiritgan ma'lumotlarni doimo tozalang.
3. CSRF (Cross-Site Request Forgery) hujumlaridan himoya: CSRF tokenlaridan foydalaning.

// XSS hujumidan himoyalanish uchun
function sanitize(string) {
    const map = {
        '&': '&',
        '<': '&lt;',
        '>': '&gt;',
        '"': '&quot;',
        "'": '&#x27;',
        "/": '&#x2F;',
    };
    const reg = /[&<>"'/]/ig;
    return string.replace(reg, (match)=>(map[match]));
}

// Foydalanish
const userInput = "<script>alert('XSS');</script>";
setCookie("userInput", sanitize(userInput), 1);

Cookies va GDPR

GDPR (General Data Protection Regulation) qoidalariga ko'ra, foydalanuvchilardan cookies ishlatish uchun rozilik olish kerak:

function setCookieConsent() {
    if (getCookie('cookieConsent') !== 'true') {
        const consent = confirm("Bizning saytimiz cookies ishlatadi. Rozimisiz?");
        if (consent) {
            setCookie('cookieConsent', 'true', 365);
        }
    }
}

// Sahifa yuklanganda chaqirish
window.onload = setCookieConsent;

Cookies Alternativlari

Cookies'ga alternativalar:

1. Web Storage (localStorage va sessionStorage)
2. IndexedDB
3. WebSQL (eskirgan)

Misol uchun localStorage:

// Ma'lumot saqlash
localStorage.setItem('username', 'John Doe');

// Ma'lumotni o'qish
const username = localStorage.getItem('username');

// Ma'lumotni o'chirish
localStorage.removeItem('username');

Eng Yaxshi Amaliyotlar

1. Faqat zarur ma'lumotlarni cookie'larda saqlang.
2. Cookie'lar uchun amal qilish muddatini o'rnating.
3. Secure va HttpOnly flaglaridan foydalaning.
4. Cookie'larni shifrlang yoki imzolang.
5. GDPR talablariga rioya qiling.
6. Foydalanuvchilarga cookie siyosati haqida ma'lumot bering.

Xulosa

Cookies veb-ilovalar uchun foydali vosita bo'lib, foydalanuvchi ma'lumotlarini saqlash va kuzatib borish imkonini beradi. Biroq, ularni to'g'ri va xavfsiz ishlatish muhimdir. Ushbu qo'llanmada keltirilgan usullar va eng yaxshi amaliyotlarni qo'llash orqali, siz JavaScript'da cookies'dan samarali va xavfsiz foydalanishingiz mumkin.