Как удалить Cookies?

👨‍💻 Frontend Developer 🟠 Может встретиться 🎚️ Средний
#JavaScript #Браузер #База JS

Краткий ответ

Удалить Cookie можно, установив ей дату истечения в прошлом. Браузер автоматически удалит такие Cookies. 🗑️

// Удаляем конкретную cookie
document.cookie = 'username=; expires=Thu, 01 Jan 1970 00:00:00 GMT';
 
// Важно: путь и домен должны совпадать с оригинальной cookie!

Полный ответ

Удалить Cookie — как выкинуть просроченную записку. Нужно поставить на ней дату “просрочено” и браузер сам её выкинет! 📝❌

Основной способ — установить дату истечения в прошлое:

// Удаляем cookie, установив прошедшую дату
document.cookie = 'username=; expires=Thu, 01 Jan 1970 00:00:00 GMT';

Важные детали удаления

Путь (path) должен совпадать

// Если cookie была установлена с путём
document.cookie = 'theme=dark; path=/admin';
 
// То и при удалении нужно указать тот же путь
document.cookie = 'theme=; path=/admin; expires=Thu, 01 Jan 1970 00:00:00 GMT';

Домен (domain) должен совпадать

// Если cookie была установлена с доменом
document.cookie = 'user=ivan; domain=.example.com';
 
// То и при удалении нужно указать тот же домен
document.cookie = 'user=; domain=.example.com; expires=Thu, 01 Jan 1970 00:00:00 GMT';

Функция для удаления Cookies

function deleteCookie(name) {
  document.cookie = `${name}=; expires=Thu, 01 Jan 1970 00:00:00 GMT`;
}
 
// Используем
deleteCookie('username');

Удаление с параметрами

function deleteCookie(name, path = '/', domain = '') {
  let cookieString = `${name}=; expires=Thu, 01 Jan 1970 00:00:00 GMT; path=${path}`;
  if (domain) {
    cookieString += `; domain=${domain}`;
  }
  document.cookie = cookieString;
}
 
// Удаляем с конкретным путём
deleteCookie('theme', '/admin');

Когда нужно удалять Cookies

Выход из аккаунта

// ✅ Удаляем авторизационные данные
document.cookie = 'token=; expires=Thu, 01 Jan 1970 00:00:00 GMT';
document.cookie = 'userId=; expires=Thu, 01 Jan 1970 00:00:00 GMT';

Сброс настроек

// ✅ Удаляем пользовательские настройки
document.cookie = 'language=; expires=Thu, 01 Jan 1970 00:00:00 GMT';
document.cookie = 'theme=; expires=Thu, 01 Jan 1970 00:00:00 GMT';

Очистка устаревших данных

// ✅ Удаляем старые cookies
document.cookie = 'oldSetting=; expires=Thu, 01 Jan 1970 00:00:00 GMT';

Частые ошибки

Не совпадают параметры

// ❌ Ошибка — cookie не удалится, если параметры не совпадают
document.cookie = 'user=ivan; path=/admin; domain=.example.com';
document.cookie = 'user=; expires=Thu, 01 Jan 1970 00:00:00 GMT'; // Без path и domain!
 
// ✅ Правильно — совпадают все параметры
document.cookie = 'user=; path=/admin; domain=.example.com; expires=Thu, 01 Jan 1970 00:00:00 GMT';
// ❌ Невозможно — HttpOnly cookies нельзя удалить через JavaScript
// Только сервер может установить такие cookies
// document.cookie = 'serverToken=; expires=...'; // Не сработает!

Простые правила

  1. Прошедшая дата — ставь expires=Thu, 01 Jan 1970 00:00:00 GMT
  2. Совпадают параметры — path и domain должны быть такими же 🎯
  3. Пустое значение — ставь пустое значение перед датой 📭
  4. HttpOnly — нельзя удалить через JavaScript ⚠️
  5. Безопасность — для важных данных используй серверное удаление 🔐

Понимание как удалять Cookies помогает правильно управлять пользовательскими данными! 💪


Хотите больше статей для подготовки к собеседованиям? Подписывайтесь на EasyAdvice, добавляйте сайт в закладки и совершенствуйтесь каждый день 💪