Existe algum método de consumir diretamente o retorno de um GET de uma API com o javascript, estou verificando pela net mas não encontro nada especifico.
Solucionado (ver solução)
Solucionado
(ver solução)
7
respostas
respostas
Consumo de API Rest com JavaScript
Existe a classe XMLHttpRequest, que fornece métodos para recuperar dados. Aí vai um exemplo de sua utilização: https://stackoverflow.com/a/4033310
estou tentanto com o XMLHttpRequest, mas da erro, informando "blocked by CORS policy"
function Get(yourUrl){
var Httpreq = new XMLHttpRequest(); // a new request
Httpreq.open("GET",yourUrl,false);
Httpreq.send(null);
return Httpreq.responseText;
}
var json_obj = JSON.parse(Get("http://192.168.1.4:3000"));
console.log("this is the author name: "+json_obj.title);
Oi Guilherme tudo bem?
Você só pode consumir serviços do mesmo servidor ou se o outro servidor autorizar você.
São as regras da internet, fizeram isso para não carregarem sites dentro de outros sites e assim roubar informações. Tipo carregar um internet banking dentro de um site malicioso e o cliente nem perceber que tava dando seu login e senha para um terceiro.
Caso o outro servidor back-end seja seu abre um novo tópico sobre ele na categoria do fórum da linguagem dele pro pessoal de lá poder te ajudar!!!
Espero ter ajudado!!!
André, obrigado pela ajuda, consigo fazer as requisições pelo get do postman normalmente, e ainda não apliquei nenhum tipo de autenticação na API, seria o caso da própria API bloquear a requisição?
Por padrão as APIs bloqueiam essas requisições, usualmente temos que configurar ou a aplicação ou o servidor para permitir requisições de outros domínios. Nesse link conseguimos ver exemplos de como configurar em alguns ambientes:
Conseguir resolver o problema com o CORS, mas estou tendo um problema com o parse do json, quando eu aplico um console.log diretamente do objeto retornado pelo XMLHttpRequest ele retorna normal, mostra o valor do response e do responseText normal, mas quando tento manipular o response diretamente ou até utilizar no console.log ele traz vazio
function Get(yourUrl){
var Httpreq = new XMLHttpRequest(); // a new request
Httpreq.open("GET",yourUrl,true);
Httpreq.send();
return Httpreq;
}
console.log(Get("http://192.168.1.4:3000"));
solução!
Por experiência própria e sem saber o porque o navegador dá bug quando tentar retornar um objeto do XMLHttpRequest.
Fiquei uma meia hora tentando de tudo.
O que consegui é criar uma função Sete (Set é palavra reservada) . Ela já joga o resultado que você quer em algum id.
Dá uma olhada
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<div id="div">
</div>
<script>
function Sete(yourUrl,id){
let resp;
let request = new XMLHttpRequest();
request.open('GET', yourUrl, true);
request.onload = function() {
if (request.readyState == 4 && (request.status >= 200 && request.status < 400)) {
// Success!
resp = request.responseText;
document.getElementById(id).innerText=resp;
} else {
}
};
request.onerror = function() {
// There was a connection error of some sort
console.log("Erro:"+request);
};
request.send();
}
Sete("https://pokeapi.co/api/v2/pokemon-species/132/","div");
</script>
</body>
</html>