J'essaie d'appeler une API qui renvoie des données XML en réponse.
Lorsque j'exécute ce fichier .htm sur ma machine locale, cela me donne l ' erreur suivante.
Et, lors de son exécution à partir de la plate-forme codepen.io , cela me donne l ' erreur strong >.
Mais, lorsque j'appelle l'API depuis Postman ou JSON Formatter , ça marche donne la réponse. Lorsque je le colle simplement dans le navigateur et que j'appuie sur Entrée, cela fonctionne également. Mais ne fonctionne pas avec mon code. Je ne sais pas quel est le problème. Quelqu'un peut-il m'aider s'il vous plaît?
Voici mon code
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery.parseXML demo</title>
<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
</head>
<body>
<p id="someElement">Hello</p>
<p id="anotherElement"></p>
<script>
$(document).ready(function () {
var api_url = 'http://lb.50g.nl/xml/29474bb065f2b30ca5eb3496f231bced.xml'
$.ajax({
url: api_url + $(this).text(),
dataType: "xml",
async: true,
method: "GET",
headers: {
"accept": "text/xml",
"Access-Control-Allow-Origin": "*"
},
crossDomain: true,
success: function (result) {
console.log(result);
}
})
});
</script>
</body>
</html>
3 Réponses :
Ce que vous voyez a quelque chose à voir avec ce que l'on appelle CORS.
En substance, vous n'êtes pas autorisé à demander des ressources à un autre serveur (domaine) que celui à partir duquel votre document est diffusé. Cela permet de réduire les risques d'attaques xSite.
L'API fonctionne très bien, c'est pourquoi le facteur vous récupère les données, c'est en fait le navigateur qui interdit à la requête d'être renvoyée de votre document.
Pour demander des ressources à un domaine différent de celui que vous servez, vous devez appliquer certaines règles de sécurité.
Vous pouvez consulter le répondez pour plus d'informations.
Cela peut m'aider, mais je ne suis pas un développeur professionnel. Je cherche toujours ce que je dois faire exactement. :)
Essayez de suivre la réponse donnée par 'Miracool' sur le lien que j'ai posté, cela devrait vous permettre d'accéder à l'API normalement depuis votre page. Sinon, faites-moi savoir à nouveau
Oui, j'ai essayé ça. Obtenir les mêmes erreurs. J'essaye toujours de le comprendre. :)
Je suis totalement d'accord avec MKougiouris . vous obtenez l'erreur en raison du Partage de ressources inter-origines (CORS) . ainsi votre back-end rejette tout appel API qui ne provient pas de la même origine, par exemple serveur . CORS vous aide à restreindre l'accès à certaines ressources à partir d'une origine spécifiée. cependant, si vous êtes celui qui gère le back-end, vous pouvez utiliser ce code pour donner accès à toutes les origines. header ("Access-Control-Allow-Headers", "*") . mais cela a fonctionné pour mon projet de nœud.
app.all('*', function(req, res, next) {
var origin = req.get('origin');
res.header('Access-Control-Allow-Origin', origin);
res.header("Access-Control-Allow-Headers", "X-Requested-With");
res.header('Access-Control-Allow-Headers', 'Content-Type');
next();
})
Remarque: si vous travaillez sur un projet confidentiel, vous devez restreindre l'accès mais ce qui précède donne accès à tous.
API Gateway d'AWS vous aidera à résoudre ce problème toute la journée.
Lorsque vous exécutez une requête HTTP, il est conseillé d'appeler un module depuis le back-end (avec js / node), cela vous permettra de contourner le problème CORS. mais pourquoi configurer un serveur / back-end quand vous pouvez utiliser AWS pour cela.
Avec quelques étapes supplémentaires, vous pouvez créer une API qui transmet la demande, puis l'appeler à partir de votre navigateur où elle enverra à votre page une réponse autorisée pour plusieurs domaines.
voir ma réponse ici:
Comment récupérer des données volcaniques d'origine croisée en xml?
vérifiez le type de données que vous insérez dans postMan et comparez celui-ci avec les données que vous insérez dans le navigateur, etc. comparez celles que vous trouverez la différence.