Что такое CORS?

Что такое CORS?

CORS (Cross-Origin Resource Sharing) — это механизм безопасности браузеров, основанный на политике Same-Origin Policy (SOP). SOP запрещает веб-страницам выполнять запросы к ресурсам, расположенным на других доменах, портах или протоколах, чем исходный домен страницы. Это предотвращает потенциальные угрозы, такие как кража данных через межсайтовые запросы. Однако современные веб-приложения часто требуют взаимодействия между разными источниками (например, клиентское приложение на frontend.com и API на backend-api.com). CORS решает эту проблему, позволяя серверу контролируемо разрешать запросы с других источников через специальные HTTP-заголовки.

Как работает CORS?

Механизм CORS реализуется через добавление специальных HTTP-заголовков в ответы сервера. Браузер анализирует эти заголовки и определяет, разрешён ли запрос. Процесс состоит из двух основных этапов:

1. Простой запрос (Simple Request): Если запрос использует методы GET, HEAD или POST с допустимыми Content-Types (например, text/plain) и не содержит "нестандартных" заголовков, браузер сразу отправляет его. Сервер должен вернуть ответ с заголовком Access-Control-Allow-Origin, указывающим разрешённые источники (например, * для всех или конкретный домен).

2. Предварительный запрос (Preflight Request): Для более сложных операций (например, PUT, DELETE, запросы с custom-заголовками или Content-Type application/json) браузер сначала отправляет запрос методом OPTIONS — предварительный запрос. Сервер должен ответить заголовками, разрешающими основной запрос:

    * `Access-Control-Allow-Origin`: разрешённый источник.
    * `Access-Control-Allow-Methods`: разрешённые HTTP-методы (например, `GET, POST, PUT`).
    * `Access-Control-Allow-Headers`: разрешённые заголовки запроса (например, `Authorization, Content-Type`).
    * `Access-Control-Max-Age`: время в секундах, на которое можно кэшировать предварительный ответ.

После успешного предварительного запроса браузер отправляет основной запрос.

Пример реализации CORS на сервере

Рассмотрим пример настройки CORS в Node.js с использованием Express:

const express = require('express');
const cors = require('cors'); // популярная библиотека для обработки CORS

const app = express();

// Настройка middleware CORS
app.use(cors({
    origin: 'https://frontend-client.com', // разрешаем только конкретный домен
    methods: ['GET', 'POST', 'PUT', 'DELETE'], // разрешённые методы
    allowedHeaders: ['Content-Type', 'Authorization'], // разрешённые заголовки
    credentials: true // разрешаем отправку cookies/авторизационных заголовков
}));

// Маршрут API
app.get('/api/data', (req, res) => {
    res.json({ message: 'Данные доступны только для https://frontend-client.com' });
});

app.listen(3000, () => {
    console.log('Сервер запущен с поддержкой CORS');
});

Заголовки CORS: ключевые элементы

• Access-Control-Allow-Origin: самый важный заголовок. Значение * разрешает запросы из любого источника, но не поддерживает отправку credentials. Для них требуется указать точный домен.
• Access-Control-Allow-Credentials: если установлен в true, позволяет запросу включать cookies или заголовки авторизации.
• Access-Control-Expose-Headers: список заголовков ответа, которые браузер может "увидеть" и предоставить клиентскому JavaScript (по умолчанию доступны только базовые).
• Access-Control-Request-Method и Access-Control-Request-Headers: заголовки, которые браузер отправляет в предварительном запросе (OPTIONS), чтобы указать метод и заголовки основного запроса.

Почему CORS критичен для QA Automation?

Для QA Automation Engineer понимание CORS важно при:

• Тестировании API и интеграций: нужно проверять, что сервер правильно отвечает на запросы из разных источников, и что предварительные запросы (OPTIONS) корректно обрабатываются.
• Автоматизации сквозных тестов: если автоматизированный тест (например, через Selenium) пытается получить данные с другого домена, нужно убедиться, что CORS настроен корректно, иначе тест может падать.
• Анализе ошибок: типичные ошибки в логах, связанные с CORS (No 'Access-Control-Allow-Origin' header is present, Credentials are not supported), требуют понимания для точного диагностирования проблем.

Ошибки CORS и их анализ

В консоли браузера или логах тестов могут возникать ошибки:

// Пример ошибки в консоли браузера
Access to fetch at 'https://backend-api.com/data' from origin 'https://frontend.com' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

Для диагностики QA Automation Engineer может использовать инструменты:

• Инспектор сети браузера (Network tab DevTools) для анализа заголовков запросов/ответов.
• Логирование запросов на сервере для проверки предварительных запросов OPTIONS.

CORS — не просто технический термин, а важный механизм безопасности, требующий внимания при тестировании современных распределённых веб-приложений. Его корректная настройка обеспечивает безопасное межсайтовое взаимодействие без нарушения принципов Same-Origin Policy.