Fetch API

Fetch API предоставляет интерфейс для получения ресурсов (в том числе по сети). Он покажется знакомым любому, кто использовал XMLHttpRequest, но новый API является более мощным и гибким набором функций.

Определения и использование

Fetch обеспечивает обобщённое определение объектов Request и Response (и других вещей, связанных с сетевыми запросами). Это позволит им использоваться везде, где необходимо в будущем, в том числе и для service workers, Cache API и других подобных технологий, которые обрабатывают или изменяют запросы (requests) и ответы (responses), а так же в любых других случаях, которые могут потребовать от вас генерировать свой собственный ответ программно.

Это также предоставляет определение в отношение таких понятий, как CORS и семантика заголовков HTTP origin, заменяя их обособленные определения где бы то ни было.

Чтобы создать запрос и получить данные, используется метод GlobalFetch.fetch (en-US). Он реализован во множестве интерфейсов, в том числе в Window и WorkerGlobalScope. Это позволяет использовать его практически в любом контексте для получения данных.

Метод fetch() принимает один обязательный аргумент —  путь к данным, которые вы хотите получить. Он возвращает promise, который разрешается в (Response) независимо от того, был ли запрос удачным. Вы можете также передать во втором аргументе необязательный объект с указанием опций (см. Request.)

Как только Response выполнится успешно, становятся доступными несколько методов для определения тела контента и, как его содержимое должно быть обработано (см. Body.)

Вы можете создавать запрос и ответ непосредственно, используя конструкторы Request() (en-US) и Response(), но маловероятно, что в этом есть необходимость. Напротив, более вероятно, что они будут созданы как результат работы другого API (например, FetchEvent.respondWith (en-US) в service workers.)

Отличия от jQuery

Спецификации fetch() отличаются от jQuery.ajax() тремя основными способами:

  • Промис, возвращённый из fetch(), не будет отвергнут при статусе ошибки HTTP, даже если ответ является HTTP 404 или 500. Вместо этого, оно будет разрешаться нормально (со статусом ok установленным в false), и будет отклоняться только при сбое в сети или если что-то помешало завершению запроса.

  • fetch() может получать межсайтовые куки-файлы; таким образом вы можете установить межсайтовую сессию используя fetch.

  • fetch() не будет посылать куки-файлы, если только не указано credentials: 'same-origin'.
Примечание: узнайте больше об использовании Fetch API на Using Fetch и изучите концепции на Fetch basic concepts.

Прерывание выборки

Браузеры начали добавлять экспериментальную поддержку для AbortController и AbortSignal интерфейсов (aka The Abort API), которые позволяют прерывать операции, такие как Fetch и XHR, если они ещё не завершены. Подробности смотрите на страницах интерфейсов.

Fetch интерфейсы

GlobalFetch (en-US)
Содержит метод fetch(), используемый для получения ресурсов.
Headers (en-US)
Представляет заголовки запроса/ответа, позволяет запрашивать данные и выполнять различные действия в зависимости от результата.
Request
Запрашивает ресурс.
Response
Представляет ответ на запрос.

Fetch примесь

Body
Предоставляет методы, относящиеся к телу запроса/ответа, позволяя вам определять content-type и то, как ответ должен быть обработан.

Спецификации

Спецификация Статус Комментарий
Fetch Живой стандарт Изначальное определение

Браузерная совместимость

BCD tables only load in the browser

Смотрите также