Кратко: CORS (Cross-Origin Resource Sharing) — это механизм, который позволяет серверу сказать браузеру: «Этим сайтам можно читать мои данные». Без CORS браузер блокирует все запросы с одного сайта на другой — это политика безопасности, которая называется «Same-Origin Policy» . CORS — это не запрет, а разрешение. Сервер сам решает, кому открываться, с помощью специальных HTTP-заголовков .

🧠 Политика одного источника Что такое «один источник»? У двух URL один источник, если у них совпадают протокол (http/https), домен и порт . · https://example.com/foo.html и https://example.com/bar.html — один источник. · https://example.com и http://example.com — разные протоколы. · https://example.com и https://app.example.com — разные поддомены. · https://example.com и https://example.com:9000 — разные порты. Если ваш фронтенд на frontend.com попытается отправить запрос на backend.com, браузер по умолчанию его заблокирует. Это защита от XSS и CSRF: вредоносный сайт не сможет прочитать ваши данные с банковского сайта. Но когда нужен доступ к открытому API, разработчики включают CORS .

📨 CORS-заголовки Сервер управляет CORS с помощью специальных заголовков. Основные из них : · Access-Control-Allow-Origin: указывает, какие источники могут читать данные. · Access-Control-Allow-Methods: какие HTTP-методы разрешены (GET, POST, PUT, DELETE). · Access-Control-Allow-Headers: какие кастомные заголовки разрешены. · Access-Control-Allow-Credentials: можно ли отправлять куки и авторизационные заголовки . · Access-Control-Max-Age: как долго браузер может кэшировать ответ на предварительный запрос .

⚡ Простые и предварительные запросы Простой запрос — GET или POST с базовыми заголовками. Браузер отправляет его напрямую, а сервер в ответе указывает Access-Control-Allow-Origin. Preflight request — если запрос не простой (например, PUT, DELETE, или с кастомным заголовком), браузер сначала отправляет OPTIONS-запрос . Сервер должен ответить, какие методы и заголовки разрешены. Только после этого браузер отправляет основной запрос.

🛡️ В продакшене никогда не ставьте * Access-Control-Allow-Origin: * разрешает доступ с любого сайта. Где опасно: · Если в запросе есть куки (credentials: 'include'), браузер запретит запрос с * . · Если ваш API отдаёт что-то приватное, * — это как открытая дверь. Безопасные практики : · В Access-Control-Allow-Origin указывайте конкретные домены, которые должны иметь доступ. · Для разных эндпоинтов используйте разные политики: /api/public можно открыть через *, /api/private — только для конкретных источников .

🌍 Современное положение (2026) В 2026 году CORS редко настраивают вручную. Фреймворки предоставляют готовые политики, а облачные сервисы (AWS, Azure, Caddy) позволяют управлять CORS через конфигурацию . CORS — стандартная часть веб-разработки, и её всегда проверяют . #cors #веббезопасность #frontend #restapi #javascript #http #браузер