"fetch: api to website"
Résolu
Bonjour, je souhaite récupérer une donnée api
J'ai regardé ce tuto
https://www.youtube.com/watch?v=2lt4HmLm8LE&ab_channel=NadfriJS
Mais Rien ne s'affiche côté Web.
Merci d'avance
HTML:
Javascript:
Configuration: Configuration: Windows / Firefox 101.0
J'ai regardé ce tuto
https://www.youtube.com/watch?v=2lt4HmLm8LE&ab_channel=NadfriJS
Mais Rien ne s'affiche côté Web.
Merci d'avance
HTML:
<input type="text" placeholder="Score">
<button id="btn">GET Info</button>
<div id="output"></div>
Javascript:
var myHeaders = new Headers();
myHeaders.append("Authorization", "Bearer tokenIci");
var requestOptions = {
method: 'GET',
headers: myHeaders,
redirect: 'follow'
};
btn.onclick= () =>{
fetch("lienApiIci", requestOptions)
.then(response => response.json())
.then(data => {
output.textcontent = "";
output.textcontent = 'Compte de ${data.clanTag.clanScore}';
})
.catch(error => console.log('error', error));
}
Configuration: Configuration: Windows / Firefox 101.0
8 réponses
-
Il ne semble pas possible d'utiliser l'API de clashroyale.com via du JavaScript dans un navigateur (coté client) à cause du mécanisme CORS (Cross-origin resource sharing), essaye si possible d'utiliser un script coté serveur.
Un exemple avec PHP : https://pastebin.com/2Af68dv5 -
Merci. Génial! Pitet vous êtes un chef! J'ai configuré avec xampp. Je reçois les données dans ma page indexhtml.php
Je vais essayer d'isoler une donnée avant de cloturer la discussion -
Bonjour,
Quel est le message d'erreur affiché dans la console ?
Si besoin, essaye de l'afficher comme ceci :.catch(error => console.log('error', error.message)); -
J'ai ceci:
TypeError: i is undefined
util.js:56
ReferenceError: $ is not defined
script.js?ver=18:110
error
NetworkError when attempting to fetch resource.-
Les premiers message d'erreur ne correspondent pas au code de ton premier message (pas de variable i dans ton code, ni d'utilisation de $). Un problème/oubli de chargement pour jQuery ?
Commence par corriger les autres erreurs de ton script.
Tu as bien modifier le lien de l'API dans ton code ("lienApiIci") ? Quel est le status code dans l'onglet réseau des outils de développement du navigateur pour ce lien (404 ou autre) ?
-
-
Autant pour moi ces erreurs venaient d'ailleurs et je les ai corrigé.
Quand je clique sur le bouton "Get info" ça parcours mon fichier javascript index.js et ça me met:
error
NetworkError when attempting to fetch resource.
Quand je coupe le debug, j'ai la requête OPTION au code 200 et GET de mon api à 403
Et dans le <head></head> j'ai:
<script src="jquery-3.6.0.min.js"></script>
<script src="index.js" defer></script>
A la base, j'ai pris la requête généré sous postman du fetch javascript puis je l'ai modifié avec le tuto.
J'ai remplacé le lienApiIci et le Token oui -
Maintenant le code Get me renvoie 400 ou 403 suivant ce que je fais
-
Le status code 400 indique que le requête n'est pas correcte (syntaxe ou contenu invalide). 403 indique un problème d'autorisation. Le token passé dans l'entête est correcte ?
C'est pour utiliser quelle API (Clash of Clan à priori) ? Essaye de consulter la documentation de l'API, tu devrais y trouver plus d'infos.
-
-
J"essaye de récupérer un get clanTag mais toujours cette erreur 400
"Le client fournit des paramètres incorrecte pour la requête."
https://developer.clashroyale.com/#/documentation -
Dans réseau quand je clique sur le fichier .js où il y a le code 400 et j'ai:
btn.onclick
(Asynchrone : EventHandlerNonNull)
