Fetch API

Baseline Widely available *

This feature is well established and works across many devices and browser versions. It’s been available across browsers since ⁨março de 2017⁩.

* Some parts of this feature may have varying levels of support.

Experimental:Esta é umatecnologia experimental
Verifique atabela de compatibilidade entre Navegadores cuidadosamente antes de usar essa funcionalidade em produção.

A Fetch API fornece uma interface para buscar recursos (por exemplo, em toda a rede). Parecerá familiar para qualquer pessoa que tenha usado XMLHttpRequest, porém a nova API oferece um conjunto de recursos mais poderoso e flexível.

Conceitos e uso

O Fetch fornece uma definição genérica de objetos deRequest eResponse (e outras coisas envolvidas com solicitações de rede). Isso permitirá que eles sejam usados onde quer que sejam necessários no futuro, seja para service workers, Cache API e outras coisas similares que manipulam ou modifiquem pedidos e respostas ou qualquer tipo de caso de uso que possa exigir que você gere suas próprias responses programaticamente.

Ele também fornece uma definição para conceitos relacionados como CORS e a semântica de cabeçalho de origem HTTP, suplantando suas definições separadas em outro lugar.

Para fazer uma solicitação e buscar um recurso, use o métodoGlobalFetch.fetch . Ele é implementado em várias interfaces, especificamenteWindow eWorkerGlobalScope. Isso torna disponível em praticamente qualquer contexto em que você possa querer obter recursos.

O método fetch () tem um argumento obrigatório, o caminho para o recurso que deseja obter. Ele retorna uma promessa que resolve aResponse para esta requisição, seja ele bem-sucedido ou não. Você também pode, opcionalmente, passar um objeto de opções de inicialização como o segundo argumento (consulteRequest).

Uma vez que umaResponse é recuperada, há uma série de métodos disponíveis para definir o conteúdo do corpo e como ele deve ser tratado (vejaBody.)

Você pode criar um pedido e uma resposta diretamente usando os construtoresRequest() eResponse(), mas é improvável que você faça isso diretamente. Em vez disso, é mais provável que sejam criados como resultados de outras ações da API (por exemplo,FetchEvent.respondWith de service workers).

Nota:Encontre mais informações sobre os recursos do Fetch API emUsing Fetch, e conceitos para estudos emFetch basic concepts.

Fetch Interfaces

GlobalFetch: Contém o métodofetch() usado para buscar um recurso.
Headers: Representa cabeçalhos response/request, permitindo que você os consulte e faça diferentes ações dependendo dos resultados.
Request: Representa um pedido de recursos.
Response: Representa a resposta de uma requisição.

Fetch mixin

Body: Providencia métodos relacionados ao corpo da resposta/requisição, permitindo que você declare qual seu tipo de conteúdo e como ele deve ser tratado.