Как пользоваться: Генератор CORS-заголовков
- В разделе Генерация заголовков укажите источники, которым можно обращаться к вашему API (или разрешите любые), отметьте методы и введите заголовки запроса, которые отправляет ваш фронтенд, — обычно это
Content-TypeиAuthorization. - Отметьте Разрешить credentials, только если браузеру нужно отправлять cookies или заголовок Authorization с
credentials: 'include'. - Выберите платформу и скопируйте код — Express, Nginx, Apache, Netlify, Vercel, Next.js, Workers или PHP.
- Разверните изменения, затем перейдите в раздел Проверить URL: введите URL API и источник страницы, чтобы увидеть, пройдут ли preflight и основной запрос.
Почему браузеры блокируют запросы
Страница на https://app.example.com может прочитать ответ от https://api.example.com только в том случае, если API разрешает это с помощью CORS-заголовков. Для всего, что выходит за рамки простого GET или отправки формы POST — JSON-тела, заголовки Authorization, PUT или DELETE — браузер сначала отправляет preflight: запрос OPTIONS, который спрашивает: «может ли этот источник использовать такой метод и такие заголовки?». Если ответа нет или он неверный, вы видите «Заблокировано политикой CORS», и ваш код так и не получает ответ.
| Заголовок | Что он должен содержать |
|---|---|
Access-Control-Allow-Origin | Точный источник вызывающей страницы или * (не допускается с credentials) |
Access-Control-Allow-Methods | Метод основного запроса (только для preflight) |
Access-Control-Allow-Headers | Все нестандартные заголовки запроса, например Authorization или Content-Type: application/json |
Access-Control-Allow-Credentials | true, если отправляются cookies или другие credentials |
Access-Control-Max-Age | Как долго браузер может кэшировать ответ на preflight |
Vary: Origin | Нужен, когда разрешённый источник меняется от запроса к запросу, чтобы кэши не отдавали ответ одного источника другому |
Как работает проверка
Наш сервер отправляет запрос с заголовком Origin и, если браузеру нужен preflight, запрос OPTIONS с Access-Control-Request-Method и -Headers — так же, как Chrome или Firefox. Затем он сверяет ответ с правилами CORS, которые применяют браузеры. Серверы, которые разрешают доступ только с определённых IP-адресов или требуют cookies, могут отвечать реальным пользователям иначе. Также см.: HTTP Header Checker, API Tester, Security Headers Checker.
Также ищут как: access-control-allow-origin, cors preflight тест, express cors, nginx cors настройка.
Инструменты, которые хорошо сочетаются с Генератор CORS-заголовков
- Генератор CSP — Выберите, что загружает ваш сайт: скрипты, стили, изображения, шрифты, аналитику, встраиваемые элементы.
- cURL в код — Вставьте команду curl из документации к API или пункт «Copy as cURL» из DevTools браузера, и вы получите готовый код для шести языков с сохранёнными заголовками, телом запроса и авторизацией.
- Генератор конфига Nginx — Выберите, что должен делать Nginx: отдавать статический сайт или SPA, проксировать запросы к приложению на Node/Python или обрабатывать PHP.
- Анализатор заголовков письма — Вставьте исходные заголовки письма, чтобы увидеть весь его путь: каждый почтовый сервер и время, которое он потратил, результаты SPF, DKIM и DMARC, IP-адрес отправителя и тревожные признаки, например несовпадающие Reply-To или Return-Path.