XMLHttpRequest Origine null n'est pas autorisé Access-Control-Allow-Origin pour le fichier:/// file:/// (sans serveur)
j'essaye 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.
quand j'essaie D'utiliser le plugin AJAXSLT pour jQuery pour traiter un fichier XML avec un modèle XSL (dans les 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 index la requête est file:///C:/path/to/XSL%20Website/index.html
alors que les fichiers JavaScript utilisés sont stockés dans file:///C:/path/to/XSL%20Website/assets/js/
.
Comment puis-je résoudre ce problème?
8 réponses
pour les cas où l'exécution d'un serveur web local n'est pas une option, vous pouvez autoriser Chrome à accéder aux fichiers file://
via un commutateur de navigateur. Après quelques recherches, j'ai trouvé cette discussion , qui mentionne un commutateur de navigateur dans le poteau d'ouverture. Lancez votre instance Chrome avec:
chrome.exe --allow-file-access-from-files
cela peut être acceptable pour les environnements de développement, mais peu d'autres choses. vous ne voulez certainement pas de ça tout le temps. Encore semble être une question ouverte (à partir de janvier 2011).
voir aussi: problèmes avec jQuery getJSON utilisant des fichiers locaux dans Chrome
essentiellement la seule façon de gérer cela est d'avoir un serveur Web fonctionnant sur localhost et de les servir à partir de là.
il n'est pas sûr pour un navigateur pour permettre à une demande ajax d'accéder à n'importe quel fichier sur votre ordinateur, donc la plupart des navigateurs semblent traiter "fichier: / /" requêtes comme n'ayant pas d'origine aux fins de " même Politique D'origine
Démarrer un serveur web peut être aussi trivial que cd
ing dans le répertoire les fichiers sont en cours d'exécution:
python -m SimpleHTTPServer
voici un applescript 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 (). C'est un paramètre global, mais vous pouvez également définir le crossDomain option sur 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, ie:
<input type="file" name="filename" id="filename">
<script>
$("#filename").change(function (e) {
if (e.target.files != undefined) {
var reader = new FileReader();
reader.onload = function (e) {
// Get all the contents in the file
var data = e.target.result;
// other stuffss................
};
reader.readAsText(e.target.files.item(0));
}
});
</script>
maintenant, cliquez sur Choose file
bouton et parcourir le fichier file:///C:/path/to/XSL%20Website/data/home.xml
lancer chrome comme ceci pour contourner cette restriction: open -a "/Applications/Google Chrome.app/Contents/MacOS/Google Chrome" --args --allow-file-access-from-files
.
dérivé de commentaire de Josh Lee mais je devais spécifier le chemin complet de Google Chrome afin d'éviter que Google Chrome s'ouvre à partir de ma partition Windows (en Parallels).
vous pouvez essayer de mettre 'Access-Control-Allow-Origin':'*'
dans response.writeHead(, {[here]})
.
la façon dont je viens de travailler autour de cela n'est pas du tout d'utiliser XMLHTTPRequest, mais inclure les données nécessaires dans un fichier javascript séparé à la place. (Dans mon cas, j'ai eu besoin D'un blob SQLite binaire à 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 <div>
pour que je puisse les copier).
var base64_data = "U1FMaXRlIGZvcm1hdCAzAAQA ...<snip lots of data> AhEHwA==";
et puis inclus les données dans le html comme javascript normal:
<div id="test"></div>
<script src="base64_data.js"></script>
<script>
data = atob(base64_data);
var sqldb = new SQL.Database(data);
// Database test code from the sql.js project
var test = sqldb.exec("SELECT * FROM Genre");
document.getElementById("test").textContent = JSON.stringify(test);
</script>
j'imagine qu'il serait futile de modifier ceci pour lire JSON, peut-être même XML; je vais laisser cela comme un exercice pour le lecteur;)