Какие проблемы связанные с CORS встречаются на практике и как их решать?

Частые проблемы с CORS: ошибка «No Access-Control-Allow-Origin», проблемы с preflight, credentials с ``, кастомные заголовки. Решают настройкой заголовков на сервере или прокси.**

Частые проблемы и решения

«No Access-Control-Allow-Origin»

Сервер не прислал заголовок для вашего origin.

Решение: настроить Access-Control-Allow-Origin на сервере (конкретный origin или *).

Preflight не проходит

Сложный запрос (PUT, JSON, кастомные заголовки) → браузер шлёт OPTIONS, а сервер его не обрабатывает.

Решение: сервер должен отвечать на OPTIONS с Access-Control-Allow-Methods/Headers и статусом 204.

Credentials с wildcard

При credentials: 'include' нельзя Access-Control-Allow-Origin: *.

Решение: указать конкретный origin + Access-Control-Allow-Credentials: true.

Кастомные заголовки блокируются

Authorization, кастомные заголовки не разрешены.

Решение: добавить их в Access-Control-Allow-Headers.

Чужой API без CORS

Нет доступа к серверу стороннего API.

Решение: прокси (свой backend или dev-прокси).

Работает в Postman, не в браузере

CORS — только в браузере.

Решение: настроить заголовки на сервере (не проблема API как такового).

Общий подход

• Свой backend → настроить заголовки (middleware cors).
• Чужой API → прокси.
• Разработка → dev-прокси (Vite/Webpack).

Коротко для собеседования

Частые проблемы CORS: «No Access-Control-Allow-Origin» (сервер не разрешил origin), непройденный preflight (сервер не обрабатывает OPTIONS), credentials с * (нужен конкретный origin), заблокированные кастомные заголовки (добавить в Allow-Headers), чужой API без CORS (прокси). Решают настройкой заголовков на сервере (cors) или прокси; в разработке — dev-прокси.