Вы читаете английскую версию этой статьи, так как пока нет перевода на данный язык. Помогите нам перевести эту статью!
Fetch API предоставляет интерфейс для получения ресурсов (в том числе по сети). Он покажется знакомым любому, кто использовал XMLHttpRequest
, но новый API является более мощным и гибким набором функций.
Oпределения и использование
Fetch обеспечивает обобщенное определение объектов Request
и Response
(и других вещей, связанных с сетевыми запросами). Это позволит им использоваться везде, где необходимо в будущем, в том числе и для service workers, Cache API и других подобных технологий, которые обрабатывают или изменяют запросы (requests) и ответы (responses), а так же в любых других случаях, которые могут потребовать от вас генерировать свой собственный ответ программно.
Это также предоставляет определение в отношение таких понятий, как CORS и семантика заголовков HTTP origin, заменяя их обособленные определения где бы то ни было.
Чтобы создать запрос и получить данные, используется метод GlobalFetch.fetch
. Он реализован во множестве интерфейсов, в том числе в Window
и WorkerGlobalScope
. Это позволяет использовать его практически в любом контексте для получения данных.
Метод fetch()
принимает один обязательный аргумент — путь к данным, которые вы хотите получить. Он возвращает promise, который разрешается в (Response
) независимо от того, был ли запрос удачным. Вы можете также передать во втором аргументе необязательный объект с указанием опций (см. Request
.)
Как только Response
выполнится успешно, становятся доступными несколько методов для определения тела контента и, как его содержимое должно быть обработано (см. Body
.)
Вы можете создавать запрос и ответ непосредственно, используя конструкторы Request()
и Response()
, но маловероятно, что в этом есть необходимость. Напротив, более вероятно, что они будут созданы как результат работы другого API (например, FetchEvent.respondWith
в service workers.)
Заметка: узнайте больше об использовании Fetch API на Using Fetch и изучите концепции на Fetch basic concepts.
Прерывание выборки
Браузеры начали добавлять экспериментальную поддержку для AbortController
и AbortSignal
интерфейсов (aka The Abort API), которые позволяют прерывать операции, такие как Fetch и XHR, если они еще не завершены. Подробности смотрите на страницах интерфейсов.
Fetch интерфейсы
GlobalFetch
- Содержит метод
fetch()
, используемый для получения ресурсов. Headers
- Представляет заголовки запроса/ответа, позволяет запрашивать данные и выполнять различные действия в зависимости от результата.
Request
- Запрашивает ресурс.
Response
- Представляет ответ на запрос.
Fetch примесь
Body
- Предоставляет методы, относящиеся к телу запроса/ответа, позволяя вам определять content-type и то, как ответ должен быть обработан.
Спецификации
Спецификация | Статус | Комментарий |
---|---|---|
Fetch | Живой стандарт | Изначальное определение |
Браузерная совместимость
Компьютеры | Мобильные | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
fetch | Chrome Полная поддержка 42 | Edge Полная поддержка 14 | Firefox
Полная поддержка
39
| IE Нет поддержки Нет | Opera
Полная поддержка
29
| Safari Полная поддержка 10.1 | WebView Android Полная поддержка 42 | Chrome Android Полная поддержка 42 | Firefox Android
Полная поддержка
39
| Opera Android
Полная поддержка
29
| Safari iOS Полная поддержка 10.3 | Samsung Internet Android ? |
Support for blob: and data: | Chrome Полная поддержка 48 | Edge Нет поддержки Нет | Firefox ? | IE Нет поддержки Нет | Opera ? | Safari ? | WebView Android Полная поддержка 43 | Chrome Android Полная поддержка 48 | Firefox Android ? | Opera Android ? | Safari iOS ? | Samsung Internet Android ? |
referrerPolicy | Chrome Полная поддержка 52 | Edge Нет поддержки Нет | Firefox Полная поддержка 52 | IE Нет поддержки Нет | Opera Полная поддержка 39 | Safari Полная поддержка 11.1 | WebView Android Полная поддержка 52 | Chrome Android Полная поддержка 52 | Firefox Android Полная поддержка 52 | Opera Android Полная поддержка 41 | Safari iOS Нет поддержки Нет | Samsung Internet Android ? |
signal | Chrome Полная поддержка 66 | Edge Полная поддержка 16 | Firefox Полная поддержка 57 | IE Нет поддержки Нет | Opera Полная поддержка 53 | Safari Полная поддержка 11.1 | WebView Android Полная поддержка 66 | Chrome Android Полная поддержка 66 | Firefox Android Полная поддержка 57 | Opera Android Полная поддержка 47 | Safari iOS Полная поддержка 11.3 | Samsung Internet Android Нет поддержки Нет |
Streaming response body | Chrome Полная поддержка 43 | Edge Полная поддержка 14 | Firefox
Полная поддержка
Да
| IE Нет поддержки Нет | Opera Полная поддержка 29 | Safari Полная поддержка 10.1 | WebView Android Полная поддержка 43 | Chrome Android Полная поддержка 43 | Firefox Android Нет поддержки Нет | Opera Android Нет поддержки Нет | Safari iOS Полная поддержка 10.3 | Samsung Internet Android ? |
Легенда
- Полная поддержка
- Полная поддержка
- Нет поддержки
- Нет поддержки
- Совместимость неизвестна
- Совместимость неизвестна
- Экспериментальная. Ожидаемое поведение может измениться в будущем.
- Экспериментальная. Ожидаемое поведение может измениться в будущем.
- Смотрите замечания реализации.
- Смотрите замечания реализации.
- Пользователь должен сам включить эту возможность.
- Пользователь должен сам включить эту возможность.