Javascript Girl
  1. Javascript Girl
  3. Mon fichier XML ne fonctionne pas avec Google Chrome et Internet Explorer
Intereting Posts
Applications Angularjs multiples (portlets de conduite) Les meilleures pratiques Angular.js – extension des contrôleurs, dépassement des paramètres par défaut du contrôleur Le graphique glisse étrangement avec la couleur négative activée Comment déplacer le rectangle sur un canevas React.createClass vs ES6 arrow function Comment démarrer / arrêter jCarousel par des contrôles / événements externes JQuery cliquez sur la bordure d'un div Documentation JavaScript de VSDoc Élément box2d-js avec image externe Mode canonique pour utiliser JQueryUI Autocomplete with Meteor Barre de recherche qui masque les résultats qui ne l'ont pas tapé Création d'un objet jQuery à partir d'une grande chaîne HTML JQuery – animer l'élément DOM mobile vers un nouveau parent? JQGrid – Modifier l'ordre des colonnes InnerHTML avec des valeurs de forme courantes

Mon fichier XML ne fonctionne pas avec Google Chrome et Internet Explorer

Je fais une simple application javascript où j'ai besoin de charger des fichiers xml et de les montrer devant l'utilisateur. Mais mon code ne fonctionne que dans Mozilla Firefox, mais en ce qui concerne Chrome et Internet Explorer, ils ne fonctionnent pas. Je charge mon document XML dans une machine locale. 

$(document).ready(function() { $('.buttons').slideToggle('medium'); $.ajax({ url: "dictionary.xml", success: function( xml ) { $(xml).find("word").each(function(){ $("ul").append("<li>" + $(this).text() + "</li>"); }); } }); }

Et voici mon XML 

  <?xml version="1.0" encoding="UTF-8"?> <xml> <word> <threeletter>RIP</threeletter> <fourletter>PIER</fourletter> <fiveletter>SPIRE</fiveletter> <sixletter>SPIDER</sixletter> </word> <word> <threeletter>SUE</threeletter> <fourletter>EMUS</fourletter> <fiveletter>SERUM</fiveletter> <sixletter>RESUME</sixletter> </word> <word> <threeletter>COO</threeletter> <fourletter>CON</fourletter> <fiveletter>CONDO</fiveletter> <sixletter>CONDOM</sixletter> </word> </xml>

J'ai trouvé l'erreur, voilà 

 XMLHttpRequest cannot load file:///C:/Users/John/Desktop/JsTwist/dictionary.xml. Origin null is not allowed by Access-Control-Allow-Origin.

Google Chrome n'autorise pas les requêtes AJAX sur le file:// protocole par défaut.

Vous devrez démarrer Chrome avec le --allow-file-access .

Voici des instructions pour la fourniture de commutateurs sur chaque système d'exploitation.

Je ne sais pas comment activer le protocole de fichier pour IE.

Peut-être le plus facile à faire est de configurer un serveur Web local et d'exécuter votre application avec les fichiers xml, alors vous ne devez pas vous soucier de ce problème dans l'un ou l'autre navigateur.

modifier

Répétition tardive, je sais. Je voulais le jeter dans le cas où d'autres ont un problème.

Lorsque vous demandez un document xml avec jQuery, vous devez toujours fournir un type de données dans l'objet de configuration. En interne, jQuery fait le mieux de deviner ce qui est retourné et j'ai eu un document xml parfaitement bon pour être HTML / XHTML.

Pour ce faire, ajoutez dataType: "xml" . Par exemple: 

 $(document).ready(function() { $('.buttons').slideToggle('medium'); $.ajax({ url: "dictionary.xml", success: function( xml ) { $(xml).find("word").each(function(){ $("ul").append("<li>" + $(this).text() + "</li>"); }); }, dataType: "xml" }); }

Les types de données pris en charge sont disponibles sur la page de documentation pour jQuery.ajax () .

De plus, j'ai rencontré l'erreur Access-Control-Allow-Origin ci-dessus lors de la tentative d'extraction d'un flux RSS à partir d'un serveur distant. La seule façon dont j'ai déterminé à contourner cela est de demander proxy le flux RSS du code côté serveur et de le livrer via un script proxy. Voici un exemple simple en PHP: 

 <?php if(isset($_GET['q']) && isAjax()) { $q = strip_tags($_GET['q']); header("Status: 200"); header("Content-type: text/xml"); echo file_get_contents('http://'.$q); exit(); } function isAjax() { return (isset($_SERVER['HTTP_X_REQUESTED_WITH']) && ($_SERVER['HTTP_X_REQUESTED_WITH'] == 'XMLHttpRequest')); } ?>

CAVEAT Je recommande vivement de modifier le script ci-dessus pour permettre uniquement les emplacements que vous prévoyez de servir dans votre code client en validant q ou en limitant davantage la fonction isAjax . Je ne suis pas un développeur PHP et je ne prétends pas connaître les meilleures pratiques pour la sécurité PHP. Si quelqu'un a des suggestions pour améliorer l'extrait de PHP, je serais heureux de les appliquer.