Метод fetch — это XMLHttpRequest нового поколения. Он предоставляет улучшенный интерфейс для осуществления запросов к серверу: как по части возможностей и контроля над происходящим, так и по синтаксису, так как построен на промисах.
Поддержка в браузерах пока не очень распространена, но есть полифилл и не один.
Синтаксис
Синтаксис метода fetch:
url– URL, на который сделать запрос,options– необязательный объект с настройками запроса.
Свойства options:
method– метод запроса,headers– заголовки запроса (объект),body– тело запроса:FormData,Blob, строка и т.п.mode– одно из: «same-origin», «no-cors», «cors», указывает, в каком режиме кросс-доменности предполагается делать запрос.credentials– одно из: «omit», «same-origin», «include», указывает, пересылать ли куки и заголовки авторизации вместе с запросом.cache– одно из «default», «no-store», «reload», «no-cache», «force-cache», «only-if-cached», указывает, как кешировать запрос.redirect– можно поставить «follow» для обычного поведения при коде 30x (следовать редиректу) или «error» для интерпретации редиректа как ошибки.
Как видно, всевозможных настроек здесь больше, чем в XMLHttpRequest. Вместе с тем, надо понимать, что если мы используем полифилл, то ничего более гибкого, чем оригинальный XMLHttpRequest мы из этого не получим.
Разве что, fetch, возможно, будет удобнее пользоваться.
Использование
При вызове fetch возвращает промис, который, когда получен ответ, выполняет коллбэки с объектом Response или с ошибкой, если запрос не удался.
Пример использования:
Объект response кроме доступа к заголовкам headers, статусу status и некоторым другим полям ответа, даёт возможность прочитать его тело, в желаемом формате.
Варианты описаны в спецификации Body, они включают в себя:
response.arrayBuffer()response.blob()response.formData()response.json()response.text()
Соответствующий вызов возвращает промис, который, когда ответ будет получен, вызовет коллбэк с результатом.
В примере выше мы можем в первом .then проанализировать ответ и, если он нас устроит – вернуть промис с нужным форматом. Следующий .then уже будет содержать полный ответ сервера.
Больше примеров вы можете найти в описании полифилла для fetch.
Итого
Метод fetch – уже сейчас удобная альтернатива XMLHttpRequest для тех, кто не хочет ждать и любит промисы.
Детальное описание этого метода есть в стандарте Fetch, а простейшие примеры запросов — в описании к полифиллу.
