Request()

var myRequest = new Request(input[, init]);

input

Define o recurso que você deseja buscar. Isso pode ser:

• Um USVString (en-US) contendo o URL direto do recurso que você deseja buscar.
• Um objeto Request, criando efetivamente uma cópia. Observe as seguintes atualizações comportamentais para reter a segurança e, ao mesmo tempo, tornar o construtor menos propenso a gerar exceções:
  • Se esse objeto existir em outra origem para a chamada do construtor, o Request.referrer (en-US) será removido.
  • Se esse objeto tiver um Request.mode (en-US) de navegação, o valor do modo será convertido para a mesma origem.

init Optional

Um objeto de opções contendo quaisquer configurações personalizadas que você deseja aplicar à solicitação. As opções possíveis são:

• method: O método de request, ex: GET, POST.
• headers: Quaisquer cabeçalhos que você deseja adicionar à sua solicitação, contidos em um objeto Headers (en-US) ou em um objeto literal com valores de ByteString (en-US).
• body: Qualquer corpo que você deseja adicionar à sua solicitação: isso pode ser um Blob, BufferSource, FormData, URLSearchParams, USVString (en-US), ou objeto ReadableStream (en-US). Observe que uma solicitação usando o método GET ou HEAD não pode ter um corpo.
• mode: O modo que você deseja usar para a solicitação, por exemplo: cors, no-cors, same-origin, or navigate. O padrão é cors. No Chrome o padrão é no-cors antes do Chrome 47 e same-origin do Chrome 47 em diante.
• credentials: As credenciais de solicitação que você deseja usar para a solicitação: omit, same-origin, ou include. O padrão é omit. No Chrome o padrão é same-origin antes do Chrome 47 e include do Chrome 47 em diante.
• cache: O cache mode (en-US) que você deseja usar para a solicitação.
• redirect: O modo de redirecionamento para usar: follow, error, or manual. No Chrome o padrão é follow (antes do Chrome 47 foi padronizado manual).
• referrer: Um USVString (en-US) especificando no-referrer, client, ou uma URL. O padrão é client.
• integrity: Contém o valor de integridade do sub-recurso (en-US) da solicitação (exemplo: sha256-BpfBw7ivV8q2jLiT13fxDYAe2tJllusRSZ273h2nFSE=).

Em nosso exemplo Fetch Request(veja Fetch Request live) nós criamos um novo objeto Request usando o construtor, em seguida, busque-o usando uma chamada GlobalFetch.fetch (en-US). Como estamos buscando uma imagem, executamos o Body.blob (en-US) na resposta para fornecer o tipo MIME adequado para que ela seja manipulada corretamente. Em seguida, criamos uma URL do objeto e a exibimos em um Elemento <img>.

var myImage = document.querySelector("img");

var myRequest = new Request("flowers.jpg");

fetch(myRequest)
  .then(function (response) {
    return response.blob();
  })
  .then(function (response) {
    var objectURL = URL.createObjectURL(response);
    myImage.src = objectURL;
  });

Em nosso Fetch Request with init example (veja Fetch Request init live) nós fazemos a mesma coisa, exceto que passamos em um objeto init quando invocamos fetch():

var myImage = document.querySelector('img');

var myHeaders = new Headers();
myHeaders.append('Content-Type', 'image/jpeg');

var myInit = { method: 'GET',
               headers: myHeaders,
               mode: 'cors',
               cache: 'default' };

var myRequest = new Request('flowers.jpg',myInit);

fetch(myRequest).then(function(response) {
  ...
});

Observe que você também pode passar o objeto init para a chamada fetch para obter o mesmo efeito, por exemplo:

fetch(myRequest,myInit).then(function(response) {
  ...
});

Você também pode usar um literal de objeto como headers em init.

var myInit = {
  method: "GET",
  headers: {
    "Content-Type": "image/jpeg",
  },
  mode: "cors",
  cache: "default",
};

var myRequest = new Request("flowers.jpg", myInit);

Você também pode passar um objeto Request para o construtor Request() para criar uma cópia do Request (isso é semelhante a chamar o método clone() (en-US) .)

var copy = new Request(myRequest);

• ServiceWorker API (en-US)
• HTTP access control (CORS) (en-US)
• HTTP