Что такое CORS и зачем он нужен?

Что такое CORS

• Механизм веб-безопасности и политика браузера
• Cross-Origin Resource Sharing — технология обмена ресурсами между источниками
• Определяет, разрешены ли запросы с других доменов
• Настраивается с помощью HTTP-заголовков (Access-Control-Allow-Origin и др.)
• Помогает предотвращать атаки типа «межсайтовый скриптинг» (XSS)
• Необходим для API и веб-приложений, у которых фронтенд и бэкенд работают на разных доменах
• Обеспечивает безопасный обмен ресурсами между сайтами при соблюдении правил

Подробный ответ

Основной ответ

CORS (Cross-Origin Resource Sharing) — браузерный механизм безопасности, определяющий, могут ли веб-страницы обращаться к ресурсам, расположенным в другом домене (происхождении). Его задача — блокировать небезопасные кросс-доменные запросы и защищать пользователя от атак типа CSRF и XSS.

Ключевые моменты

• В обычном режиме браузеры применяют политику Same-Origin Policy: скрипт не может получить доступ к ресурсам другого домена, пока тот явно не предоставит такое разрешение. С помощью CORS сервер передаёт специальные HTTP-заголовки (Access-Control-Allow-Origin), указывающие, каким источникам разрешены запросы.
• Механизм различает несколько категорий запросов. simple requests — например, GET и POST с простыми заголовками — отправляются без предварительной проверки. Более сложные варианты, использующие PUT, DELETE или нестандартные заголовки, сначала запускают preflight-запроса OPTIONS, чтобы браузер проверил доступ.
• Сервер должен вернуть корректный набор заголовков. Кроме Access-Control-Allow-Origin, для управления разрешёнными методами, заголовками и передачей cookies часто применяются Access-Control-Allow-Methods, Access-Control-Allow-Headers и Access-Control-Allow-Credentials соответственно.

Практический контекст

В веб-разработке CORS становится особенно важен, если frontend и backend работают на разных хостах — например, React 18 запущен на localhost:3000, а API находится на localhost:8080. При отсутствии правильной настройки браузер заблокирует такие запросы. Решение — настроить сервер (nginx, express.js и т.д.) на передачу необходимых заголовков либо использовать proxy для обхода ограничения.