Request
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.
A interface Request da Fetch API representa uma requisição de recursos.
Você pode criar um novo objeto Request usando o construtor Request.Request(), porém é mais provável que você encontre um objeto Request que seja retornado como resultado de outra operação de API, como um service worker FetchEvent.request.
Construtor
Request.Request()-
Cria um novo objeto
Request.
Propriedades
Request.methodSomente leitura-
Contém o método da requisição (
GET,POSTetc.) Request.urlSomente leitura-
Contém a URL da requisição.
Request.headersSomente leitura-
Contém o objeto
Headersassociado à requisição. Request.contextSomente leitura Deprecated-
Contém o contexto da requisição (ex.,
audio,image,iframeetc.) Request.referrerSomente leitura-
Contém a referência da requisição (ex.,
client). Request.referrerPolicySomente leitura-
Contém a política de referência da requisição (ex.,
no-referrer). Request.modeSomente leitura-
Contém o modo da requisição (ex.,
cors,no-cors,same-origin,navigate.) Request.credentialsSomente leitura-
Contém a credencial da requisição (Ex.,
omit,same-origin,include). Request.redirectSomente leitura-
Contém o modo de como os redirecionamentos serão tratados. Pode ser:
follow,erroroumanual. Request.integritySomente leitura-
Contém o valor da subresource integrity da requisição (ex.,
sha256-BpfBw7ivV8q2jLiT13fxDYAe2tJllusRSZ273h2nFSE=). Request.cacheSomente leitura-
Contém o modo de cache da requisição (ex.,
default,reload,no-cache).
Request implementa Body, então também possui as seguintes propriedades disponíveis:
Body.bodySomente leitura-
Um simples "getter" para ler o conteúdo do corpo através da interface
ReadableStream. Body.bodyUsedSomente leitura-
Armazena um
Booleanoque declara se o corpo da requisição já foi utilizado em uma resposta.
Métodos
Request.clone()-
Cria uma cópia atual do objeto
Request.
Request implementa Body, então também possui os seguintes métodos disponíveis:
Body.arrayBuffer()-
Retorna um objeto do tipo promise que resolve um
ArrayBuffercom a representação do corpo da requisição. Body.blob()-
Retorna um objeto do tipo promise que resolve um
Blobcom a representação do corpo da requisição. Body.formData()-
Retorna um objeto do tipo promise que resolve um
FormDatacom a representação do corpo da requisição. Body.json()-
Retorna um objeto do tipo promise que resolve um
JSONcom a representação do corpo da requisição. Body.text()-
Retorna um objeto do tipo promise que resolve um
USVString(texto) com a representação do corpo da requisição.
Nota: Os métodos de Body só poderão ser executadas apenas uma vez; As chamadas subsequentes serão resolvidas com strings/ArrayBuffers vazias.
Exemplos
No exemplo a seguir, nós criamos uma nova requisição utilizando o construtor Request() (para um arquivo de imagem no mesmo diretório do código) e, em seguida, nos retorna alguns valores das propriedades da requisição:
const myRequest = new Request("http://localhost/flowers.jpg"); const myURL = myRequest.url; // http://localhost/flowers.jpg const myMethod = myRequest.method; // GET const myCred = myRequest.credentials; // omit Você poderá, então, solicitar uma nova requisição passando o objeto Request como parâmetro para a chamada GlobalFetch.fetch(), por exemplo:
fetch(myRequest) .then((response) => response.blob()) .then((blob) => { myImage.src = URL.createObjectURL(blob); }); No exemplo a seguir, nós criamos uma nova requisição utilizando o construtor Request() com alguns valores iniciais e contendo o corpo para APIs que precisam processar essas informações:
const myRequest = new Request("http://localhost/api", { method: "POST", body: '{"foo":"bar"}', }); const myURL = myRequest.url; // http://localhost/api const myMethod = myRequest.method; // POST const myCred = myRequest.credentials; // omit const bodyUsed = myRequest.bodyUsed; // true Nota: O tipo do corpo poderá ser apenas: Blob, BufferSource, FormData, URLSearchParams, USVString ou ReadableStream. Para adicionar um objeto JSON ao corpo, é necessário converter esse objeto para string.
Você poderá, então, solicitar uma nova requisição passando o objeto Request como parâmetro para a chamada GlobalFetch.fetch(), por exemplo, e poderá capturar a resposta da seguinte forma:
fetch(myRequest) .then((response) => { if (response.status === 200) { return response.json(); } else { throw new Error("Ops! Houve um erro em nosso servidor."); } }) .then((response) => { console.debug(response); // ... }) .catch((error) => { console.error(error); }); Especificações
| Specification |
|---|
| Fetch # request-class |