XMLHttpRequest Origin null n’est pas autorisé Access-Control-Allow-Origin pour le fichier: /// pour le fichier: /// (sans serveur)

J’essaie de créer un site Web qui peut être téléchargé et exécuté localement en lançant son fichier d’index.

Tous les fichiers sont locaux, aucune ressource n’est utilisée en ligne.

Lorsque j’essaie d’utiliser le plug-in AJAXSLT pour que jQuery traite un fichier XML avec un modèle XSL (dans des sous-répertoires), je reçois les erreurs suivantes:

XMLHttpRequest cannot load file:///C:/path/to/XSL%20Website/data/home.xml. Origin null is not allowed by Access-Control-Allow-Origin.

XMLHttpRequest cannot load file:///C:/path/to/XSL%20Website/assets/xsl/main.xsl. Origin null is not allowed by Access-Control-Allow-Origin.

Le fichier d’index faisant la demande est file:///C:/path/to/XSL%20Website/index.html pendant que les fichiers JavaScript utilisés sont stockés dans le file:///C:/path/to/XSL%20Website/assets/js/ .

Comment puis-je résoudre ce problème?

Pour les cas où l’exécution d’un serveur Web local n’est pas une option, vous pouvez autoriser l’access de Chrome aux file:// via un commutateur de navigateur. Après quelques recherches, j’ai trouvé cette discussion , qui mentionne un changement de navigateur lors de l’ouverture de l’article. Exécutez votre instance Chrome avec:

 chrome.exe --allow-file-access-from-files 

Cela peut être acceptable pour les environnements de développement, mais rien d’autre. Vous ne voulez certainement pas cela tout le temps. Cela semble toujours être une question ouverte (à partir de janvier 2011).

Voir aussi: Problèmes avec jQuery getJSON utilisant des fichiers locaux dans Chrome

Essentiellement, le seul moyen de résoudre ce problème est de faire fonctionner un serveur Web sur localhost et de le servir à partir de là.

Il n’est pas sûr qu’un navigateur permette à une requête ajax d’accéder à un fichier sur votre ordinateur. Par conséquent, la plupart des navigateurs semblent traiter les requêtes “file: //” comme n’ayant aucune origine aux fins de la ” politique d’origine “.

Le démarrage d’un serveur Web peut être aussi sortingvial que de l’ cd dans le répertoire où se trouvent les fichiers et en cours d’exécution:

 python -m SimpleHTTPServer 

Voici un script qui lancera Chrome avec le commutateur –allow-file-access-from-files activé pour les développeurs OSX / Chrome:

 set chromePath to POSIX path of "/Applications/Google Chrome.app/Contents/MacOS/Google Chrome" set switch to " --allow-file-access-from-files" do shell script (quoted form of chromePath) & switch & " > /dev/null 2>&1 &" 

Cette solution vous permettra de charger un script local en utilisant jQuery.getScript (). Il s’agit d’un paramètre global, mais vous pouvez également définir l’option crossDomain pour chaque demande.

 $.ajaxPrefilter( "json script", function( options ) { options.crossDomain = true; }); 

Qu’en est-il de l’utilisation de la fonction javascript FileReader pour ouvrir le fichier local, à savoir:

   

Maintenant Cliquez sur Choose file bouton Choose file et naviguez jusqu’au file:///C:/path/to/XSL%20Website/data/home.xml

Lancez chrome comme ça pour contourner cette ressortingction: open -a "/Applications/Google Chrome.app/Contents/MacOS/Google Chrome" --args --allow-file-access-from-files .

Dérivé du commentaire de Josh Lee, je devais spécifier le chemin complet vers Google Chrome afin d’éviter que Google Chrome ne s’ouvre depuis ma partition Windows (dans Parallels).

Vous pouvez essayer de mettre 'Access-Control-Allow-Origin':'*' dans response.writeHead(, {[here]}) .

La façon dont je viens de contourner ce problème n’est pas d’utiliser XMLHTTPRequest, mais d’inclure les données nécessaires dans un fichier javascript séparé. (Dans mon cas, j’avais besoin d’un blob SQLite binary à utiliser avec https://github.com/kripken/sql.js/ )

J’ai créé un fichier appelé base64_data.js (et utilisé btoa() pour convertir les données dont j’avais besoin et les insérer dans un

pour pouvoir les copier).

 var base64_data = "U1FMaXRlIGZvcm1hdCAzAAQA ... AhEHwA=="; 

et ensuite inclus les données dans le HTML comme javascript normal:

 

J’imagine que ce serait sortingvial de modifier cela pour lire JSON, peut-être même XML; Je vais laisser cela comme un exercice pour le lecteur;)