Fala pessoal, espero que vocês estejam 100%!
Vamos falar um pouco de requisições HTTP em JavaScript. Para isso, podemos usar as APIs nativas do navegador ou bibliotecas externas, como o Fetch API ou o XMLHttpRequest (XHR).
Abaixo estão exemplos de como usar o Fetch API e o XMLHttpRequest:
Usando Fetch API (recomendado para novos projetos):
// Faz uma requisição GET para uma URL
fetch('https://exemplo.com/api/dados')
.then(response => response.json()) // Converte a resposta para JSON
.then(data => {
// Faça algo com os dados recebidos (contidos em 'data')
})
.catch(error => {
// Trate possíveis erros aqui
});
// Faz uma requisição POST com dados em formato JSON
fetch('https://exemplo.com/api/enviar', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({ nome: 'Usuário', idade: 25 })
})
.then(response => response.json())
.then(data => {
// Faça algo com a resposta do servidor
})
.catch(error => {
// Trate possíveis erros aqui
});Usando XMLHttpRequest (mais antigo, mas ainda amplamente suportado):
// Faz uma requisição GET
var xhr = new XMLHttpRequest();
xhr.open('GET', 'https://exemplo.com/api/dados', true);
xhr.onreadystatechange = function() {
if (xhr.readyState === 4 && xhr.status === 200) {
var data = JSON.parse(xhr.responseText);
// Faça algo com os dados recebidos (contidos em 'data')
}
};
xhr.send();
// Faz uma requisição POST com dados em formato JSON
var xhr = new XMLHttpRequest();
xhr.open('POST', 'https://exemplo.com/api/enviar', true);
xhr.setRequestHeader('Content-Type', 'application/json');
xhr.onreadystatechange = function() {
if (xhr.readyState === 4 && xhr.status === 200) {
var data = JSON.parse(xhr.responseText);
// Faça algo com a resposta do servidor
}
};
var jsonData = JSON.stringify({ nome: 'Usuário', idade: 25 });
xhr.send(jsonData);Lembre-se de substituir “https://exemplo.com/api/dados” e “https://exemplo.com/api/enviar” pelos URLs da API que você deseja acessar.
Que tal fazer alguns estudos com algumas APIs públicas disponíveis? Confiram os seguintes links:
https://openweathermap.org/api
https://jsonplaceholder.typicode.com/
https://makeup-api.herokuapp.com/
No responses yet