Esta página foi traduzida do inglês pela comunidade. Saiba mais e junte-se à comunidade MDN Web Docs.
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 |
Compatibilidade com navegadores
Loading...