JavaScript Assincrono
- #JavaScript
- #API Rest
Alguém teve esse problema ao resolver o desafio do JavaScript Assíncrono do Bootcamp Santander?
Access to fetch at 'https://thatcopy.pw/catapi/rest/' from origin 'http://127.0.0.1:5500' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.
codigo ----------------
const BASE_URL = "https://thatcopy.pw/catapi/rest/";
const catBtn = document.getElementById("change-cat");
const catImg = document.getElementById("cat");
const getCats = async() => {
try {
const data = await fetch(BASE_URL);
// aqui estou pegando os dados do API e convertendo em JSON
const json = await data.json();
// aqui estou acessando a propriedade webpurl
return json.webpurl;
} catch (e) {
console.log(e.message);
}
}
const handleCats = async() => {
// aqui vai chamar a funcao acima para executar
catImg.src = await getCats();
}
catBtn.addEventListener("click", handleCats);
handleCats();
Bom dia Karen,
Tive o mesmo problema com este link,, porém utilizei este https://randomfox.ca/floof/ para acessar as imagens que neste caso são de lobos.
Meu código ficou conforme abaixo:
const BASE_URL = 'https://randomfox.ca/floof/';
const catBtn = document.getElementById('change-cat');
const getCats = async () => {
try {
const data = await fetch(BASE_URL);
const json = await data.json();
return json.image; //image foi retirado da url acima(BASE_URL) utilizada acima para buscar as imagens
} catch (e) {
console.log(e.message);
}
};
const loadImg = async () => {
const catImg = document.getElementById('cat');
catImg.src = await getCats();
};
catBtn.addEventListener('click', loadImg);
loadImg();
Bom dia Karen, tudo bem? Eu passei pelo mesmo problema, altere o endereço para :
const BASE_URL = 'https://api.thecatapi.com/v1/images/search';
no try, altere para: return json[0].url;
veja se funciona
Eu usei a solução do Alexandre Barros, o endereço que tá no video da Stephany não está mais funcionando.
Usei o Live Server e apontei o endereço do meu computador no celular da minha sobrinha pra ela ficar olhando as fotos dos Gatinhos, Ela adorou! :)
OBS: O computador e o celular precisam estar na mesma rede para funcionar.
Obrigada pela resposta de vocês, eu fiz aqui e deu certo!!
VALEUUUU
Karen terminei o meu e deu o mesmo erro, eu creio que seja a pagina que não esteja mais disponivel, vou alterar o endereço assim como os amigos Claudio e Alexandre fizeram.
Bom dia Karen, esse erro é comum, ocorreu comigo, como podemos ver ali da Error de Cors Policy
Oi Irmã bom dia, eu to nessa parte do curso no momento assim que eu conseguir eu lhe passo onde ocorreu o erro