Почему ваш API-запрос выполняется дважды: понимание Preflight и XHR

Когда я проверяю вкладку Network в DevTools, я часто замечаю дублирующиеся вызовы API с разными типами запросов, конкретно preflight и xhr. Это явление обычно связано с CORS (Cross-Origin Resource Sharing). XMLHttpRequest (XHR) - это фактический вызов API, который отправляет запросы данных от клиента к серверу. Запрос preflight - это маленький запрос, отправленный браузером, чтобы проверить, примет ли API запрос от текущего источника. Этот запрос обычно является запросом OPTIONS, который запрашивает разрешение на продолжение. Если сервер отвечает с соответствующими заголовками Access-Control-Allow-*, браузер отправляет фактический вызов XHR. Браузер сначала проверяет, требуется ли preflight, затем отправляет запрос OPTIONS, если необходимо, и, наконец, отправляет запрос XHR, если разрешение было получено. Если сервер отказывает в разрешении, запрос XHR блокируется. Понимание запросов preflight важно для тестировщиков, чтобы знать, что дублирующиеся вызовы API не являются ошибкой, а rather безопасной функцией. Это также помогает тестировщикам проверять разрешения CORS и verificar серверные ответы с заголовками, такими как Access-Control-Allow-Origin.