Где хранятся Cookies?

Где хранятся Cookies и как они работают

Что такое Cookies?

Cookies — это небольшие текстовые файлы, которые браузер хранит локально и отправляет на сервер с каждым HTTP запросом. Они используются для сохранения информации о пользователе: сессии, предпочтения, аутентификация.

Где физически хранятся Cookies?

Cookies хранятся на жёстком диске клиента в специальных папках в зависимости от операционной системы и браузера:

Windows:

• Chrome: C:\Users\[Username]\AppData\Local\Google\Chrome\User Data\Default\
• Firefox: C:\Users\[Username]\AppData\Roaming\Mozilla\Firefox\Profiles\[random].default\
• Edge: C:\Users\[Username]\AppData\Local\Microsoft\Edge\User Data\Default\

macOS:

• Chrome: ~/Library/Application Support/Google/Chrome/Default/
• Firefox: ~/Library/Application Support/Firefox/Profiles/[random].default/
• Safari: ~/Library/Safari/

Linux:

• Chrome: ~/.config/google-chrome/Default/
• Firefox: ~/.mozilla/firefox/[random].default/

Как работают Cookies?

1. Клиент делает первый запрос к серверу
2. Сервер отправляет заголовок Set-Cookie в ответе
3. Браузер сохраняет Cookie локально
4. При каждом последующем запросе браузер автоматически отправляет Cookie в заголовке Cookie
5. Сервер читает Cookie и использует информацию

Пример работы с Cookies

Сервер отправляет Cookie:

// Node.js/Express
app.get("/login", (req, res) => {
  res.setHeader("Set-Cookie", "sessionId=abc123; Path=/; HttpOnly; Secure; SameSite=Strict");
  res.send("Cookie установлена");
});

Браузер сохраняет и отправляет Cookie:

// Автоматически при каждом запросе
// Заголовок Cookie: sessionId=abc123

JavaScript на клиенте:

// Чтение Cookie
function getCookie(name: string): string | undefined {
  const cookieString = document.cookie;
  const cookies = cookieString.split("; ");
  
  for (const cookie of cookies) {
    const [cookieName, cookieValue] = cookie.split("=");
    if (cookieName === name) {
      return decodeURIComponent(cookieValue);
    }
  }
  return undefined;
}

// Установка Cookie
function setCookie(name: string, value: string, days: number = 7): void {
  const expirationDate = new Date();
  expirationDate.setDate(expirationDate.getDate() + days);
  
  document.cookie = `${name}=${encodeURIComponent(value)}; expires=${expirationDate.toUTCString()}; path=/`;
}

// Удаление Cookie
function deleteCookie(name: string): void {
  document.cookie = `${name}=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/`;
}

// Использование
setCookie("theme", "dark", 30);
const theme = getCookie("theme"); // "dark"
deleteCookie("theme");

Структура Cookie

Каждый Cookie содержит:

Name=Value; Path=/; Domain=.example.com; Expires=Sun, 09 Jun 2025 10:18:14 GMT; Secure; HttpOnly; SameSite=Strict

Виды Cookies

Session Cookies:

// Удаляются при закрытии браузера
Set-Cookie: sessionId=abc123; Path=/;

Persistent Cookies:

// Остаются на диске до истечения срока
Set-Cookie: theme=dark; Path=/; Max-Age=2592000;

Third-party Cookies:

// Устанавливаются доменом отличным от текущего
// Используются для трекинга и рекламы
// Современные браузеры блокируют их

DevTools для работы с Cookies

Chrome DevTools:

1. Открой F12 (DevTools)
2. Перейди на вкладку "Application"
3. В левом меню найди "Cookies"
4. Выбери домен и увидишь все Cookies
5. Можешь редактировать, удалять, добавлять

Best Practices

✅ Используй для:

• Аутентификации и сессий
• Сохранения предпочтений пользователя
• Отслеживания (с согласия пользователя)

✅ Защита:

• Всегда используй HttpOnly для чувствительных данных
• Используй Secure для передачи по HTTPS
• Используй SameSite=Strict для защиты от CSRF

❌ Не делай:

• Не сохраняй пароли в Cookies
• Не сохраняй всё в Cookies (используй localStorage или IndexedDB)
• Не забывай про GDPR (просись разрешение на cookies)

Cookies vs localStorage vs sessionStorage

Заключение

Cookies хранятся локально на диске пользователя и передаются с каждым запросом на сервер. Это мощный инструмент для сохранения состояния пользователя, но требует внимательного обращения с безопасностью. Используй HttpOnly, Secure и SameSite флаги для защиты, и всегда просись разрешение у пользователя для трекинга.