JavaScript Academy · Aula

Fazendo requisições GET

Busque dados e analise respostas JSON.

Fazendo requisições GET é uma aula grátis de JavaScript Academy no CoddyKit. Esta é a aula 1 de 4. Você pode ler a aula completa abaixo gratuitamente — depois pratica ao vivo no navegador com um editor de código integrado e um tutor de IA 24/7. Faz parte do caminho de aprendizado de JavaScript Academy, e seu progresso é sincronizado entre a web e o app CoddyKit. O curso de JavaScript Academy inclui 4 aulas no total.

O Que a API de Requisições Faz

A API de requisições faz solicitações HTTP a partir do navegador e retorna uma Promise. Ela é a substituta moderna da antiga XMLHttpRequest.

Um GET Básico

Chame fetch(url) com uma URL. Por padrão, o método é GET e a chamada é resolvida com um objeto Response.

fetch("https://api.example.com/users")
  .then((response) => {
    console.log(response.status); // 200
  });

O Objeto de Resposta

O valor resolvido é uma Response, não os dados em si. Ele contém o status, os cabeçalhos e os métodos para ler o corpo. Você precisa chamar um método de leitura do corpo para obter o conteúdo.

fetch(url).then((response) => {
  console.log(response.ok);     // true if status 200-299
  console.log(response.status); // 200
});

Analisando JSON

A maioria das APIs retorna JSON. Chame response.json(), que também retorna uma Promise resolvida com o objeto analisado.

fetch(url)
  .then((response) => response.json())
  .then((data) => {
    console.log(data); // parsed JS object/array
  });

Por Que Duas Promessas

A primeira Promise é resolvida quando os cabeçalhos chegam; a segunda (.json()) é resolvida quando o corpo completo é baixado e analisado. Por isso, você encadeia duas chamadas a .then().

Usando Execução Assíncrona

A maior parte do código usa async/await para melhorar a legibilidade. Cada await pausa a execução até que sua Promise seja resolvida.

async function getUsers() {
  const response = await fetch(url);
  const data = await response.json();
  return data;
}

Outros Leitores do Corpo

Além de json(), uma Response pode ser lida como text(), blob() (binário), arrayBuffer() ou formData(). Escolha de acordo com o que o servidor retorna.

const response = await fetch(url);
const html = await response.text(); // raw string

O Corpo É Lido Uma Vez

O corpo de uma resposta é um fluxo que pode ser consumido apenas uma vez. Chamar json() e depois text() na mesma resposta gera um erro. Use response.clone() para cloná-la se realmente precisar de ambos.

Parâmetros de Consulta

Crie cadeias de consulta com segurança usando URLSearchParams, em vez de concatená-las manualmente. Ele codifica os caracteres especiais para você.

const params = new URLSearchParams({ page: 2, q: "hello world" });
fetch("https://api.example.com/search?" + params);

Enviando Cabeçalhos

Passe um segundo argumento com opções. Para GET, normalmente você define um cabeçalho Accept ou um token de autenticação.

fetch(url, {
  headers: {
    "Accept": "application/json",
    "Authorization": "Bearer " + token
  }
});

Retornando a Promessa

Coloque a lógica das requisições em uma função que retorne a Promise para que os chamadores possam aguardá-la. Isso mantém o carregamento de dados reutilizável em todo o aplicativo.

function loadUser(id) {
  return fetch("/api/users/" + id).then((r) => r.json());
}

Verificação Rápida

Requisições GET com a API de requisições.

Recapitulação

fetch(url) retorna uma Promise para uma Response. Leia o corpo com json(), text() ou blob() (apenas uma vez). Use async/await para obter clareza, URLSearchParams para cadeias de consulta e um objeto de opções para os cabeçalhos. Coloque essa lógica em funções que retornem a Promise para reutilizá-la.

Perguntas Frequentes

A aula “Fazendo requisições GET” é grátis?

Sim — o texto completo de “Fazendo requisições GET” é grátis para ler aqui na web. Para praticá-la interativamente (um editor de código integrado e um tutor de IA 24/7) e desbloquear o restante do curso de JavaScript Academy, atualize para CoddyKit PRO. O curso de JavaScript Academy inclui 4 aulas no total.

O que vou aprender em “Fazendo requisições GET”?

Busque dados e analise respostas JSON. Você pratica JavaScript Academy com código prático que executa diretamente no navegador, e um tutor de IA 24/7 responde suas dúvidas enquanto trabalha na aula.

Preciso ter experiência prévia para começar JavaScript Academy?

Nenhuma experiência prévia é necessária. JavaScript Academy no CoddyKit é estruturado para alunos iniciantes até avançados, então você pode começar aqui ou desde o início e aprender no seu ritmo. Esta é a aula 1 de 4.

Quanto tempo leva a aula “Fazendo requisições GET”?

A maioria das aulas CoddyKit leva cerca de 5–10 minutos. Cada uma é compacta e interativa, então você faz progresso constante e retoma exatamente de onde parou entre web e app.

Posso escrever e executar código nesta aula de JavaScript Academy?

Sim. Cada aula de JavaScript Academy inclui um editor de código integrado, então você escreve e executa código real direto no navegador e recebe feedback de IA instantaneamente — nenhuma configuração local necessária.

Todas as aulas deste curso

Fazendo requisições GET
POST e envio de dados
Tratando erros e códigos de status
Cancelando requisições com AbortController

← Voltar para JavaScript Academy