Как работать с куки (cookies) в JavaScript?

Веб-разработка стала неотъемлемой частью современного мира. Изучение языков программирования стало крайне актуальным для всех, кто хочет построить успешную карьеру в данной области. Одним из таких языков является JavaScript. В этой статье мы рассмотрим, как работать с куки (cookies) в JavaScript, чтобы хранить и получать информацию о пользователях.

Что такое куки?

Куки (cookies) — это небольшие текстовые файлы, которые хранятся на компьютере пользователя. Они создаются веб-сервером и содержат информацию о пользователе, такую как настройки языка, информацию о сеансе пользователя и другие данные.

document.cookie = "username=John Doe; expires=Thu, 18 Dec 2022 12:00:00 UTC; path=/";

Установка и получение значения куки

Чтобы установить значение куки, необходимо присвоить переменной document.cookie строку в формате «ключ=значение». Например, чтобы установить куки с именем «username» и значением «John Doe», вы можете использовать следующий код:

document.cookie = "username=John Doe";

Чтобы получить значение куки, вы можете использовать свойство document.cookie. Однако оно возвращает строку со всеми доступными куки. Чтобы получить конкретное значение, можно создать функцию, которая будет извлекать нужное значение из строки куки:

function getCookieValue(cookieName) {
    let cookies = document.cookie.split('; ');
    for (let i = 0; i < cookies.length; i++) {
        let cookie = cookies[i].split('=');
        if (cookie[0] === cookieName) {
            return cookie[1];
        }
    }
    return null;
}

let username = getCookieValue("username");

Установка времени жизни куки

По умолчанию, куки хранятся только во время текущего сеанса браузера. Однако, можно указать время жизни куки, чтобы они сохранялись даже после закрытия браузера. Для этого нужно добавить параметр «expires» в строку куки с определенной датой и временем:

let expirationDate = new Date();
expirationDate.setDate(expirationDate.getDate() + 7);
document.cookie = "username=John Doe; expires=" + expirationDate.toUTCString();

Установка пути куки

Куки можно устанавливать только для определенного пути на сервере. По умолчанию, куки доступны только на текущей странице и ее поддоменах. Чтобы ограничить доступность куки для определенного пути, нужно добавить параметр «path» в строку куки:

document.cookie = "username=John Doe; path=/example";

Удаление куки

Для удаления куки нужно установить ее время жизни на прошедшую дату. Например, чтобы удалить куки с именем «username», вы можете использовать следующий код:

let expirationDate = new Date();
expirationDate.setDate(expirationDate.getDate() - 1);
document.cookie = "username=; expires=" + expirationDate.toUTCString();

Заключение

Работа с куки (cookies) является важным аспектом веб-разработки. В этой статье мы рассмотрели основные методы работы с куки в JavaScript, а именно установку и получение значения куки, установку времени жизни и пути куки, а также удаление куки. Надеюсь, эта информация будет полезной для вас при разработке веб-приложений.