Problèmes avec jQuery getJSON utilisant des fichiers locaux dans Chrome
j'ai une page test très simple qui utilise les requêtes XHR avec le $de jQuery.getJSON et $.méthodes ajax. La même page fonctionne dans certaines situations et pas dans d'autres. Spécifiquement, il ne fonctionne pas dans Chrome sur Ubuntu.
je teste sur Ubuntu 9.10 avec Chrome 5.0.342.7 beta et Mac OSX 10.6.2 avec Chrome 5.0.307.9 beta.
- il fonctionne correctement lorsque les fichiers sont installés sur un serveur web à la fois Ubuntu / Chrome et Mac / Chrome ( essayer ici ).
- il fonctionne correctement lorsque les fichiers sont installés sur le disque dur local dans Mac/Chrome (consulté avec le fichier:///...).
- Il ÉCHOUE lorsque les fichiers sont installés sur le disque dur local dans Ubuntu/Chrome (accès par file:///...).
le petit jeu de 3 fichiers peut être téléchargé dans un fichier tar/gzip à partir d'ici: http://issues.tauren.com/testjson/testjson.tgz
quand ça marche, la console Chrome dira:
XHR finished loading: "http://issues.tauren.com/testjson/data.json".
index.html:16Using getJSON
index.html:21
Object
result: "success"
__proto__: Object
index.html:22success
XHR finished loading: "http://issues.tauren.com/testjson/data.json".
index.html:29Using ajax with json dataType
index.html:34
Object
result: "success"
__proto__: Object
index.html:35success
XHR finished loading: "http://issues.tauren.com/testjson/data.json".
index.html:46Using ajax with text dataType
index.html:51{"result":"success"}
index.html:52undefined
quand il ne fonctionne pas, la console Chrome le montrera:
index.html:16Using getJSON
index.html:21null
index.html:22Uncaught TypeError: Cannot read property 'result' of null
index.html:29Using ajax with json dataType
index.html:34null
index.html:35Uncaught TypeError: Cannot read property 'result' of null
index.html:46Using ajax with text dataType
index.html:51
index.html:52undefined
Remarque qu'il ne montre même pas les requêtes XHR, bien que le handler de succès soit exécuté. Je jure que ça marchait déjà dans Ubuntu / Chrome, et je suis inquiet que quelque chose ait mal tourné. J'ai déjà désinstallé et réinstallé Chrome, mais cela n'a pas aidé.
est-ce que quelqu'un peut l'essayer localement sur votre système Ubuntu et me dire si vous avez des problèmes? Notez qu'il semble fonctionner correctement dans Firefox.
7 réponses
C'est un problème connu avec le Chrome.
voici le lien dans le bug tracker:
numéro 40787: les fichiers locaux ne se chargent pas avec Ajax
une autre façon de le faire est de démarrer un serveur HTTP local dans votre répertoire. Sur Ubuntu et MacOs avec Python installé, c'est un one-liner.
Allez dans le répertoire contenant vos fichiers web, et :
python -m SimpleHTTPServer
puis connectez-vous à http://localhost:8000/index.html avec n'importe quel navigateur web pour tester votre page.
sous Windows, Chrome peut être installé dans votre dossier AppData:
"C:\Users\\AppData\Local\Google\Chrome\Application "
avant d'exécuter la commande, assurez-vous que toutes vos fenêtres Chrome sont fermées et ne fonctionnent pas autrement. Or, le param en ligne de commande ne serait pas efficace.
chrome.exe --allow-file-access-from-files
vous pouvez placer votre json dans le fichier js et le sauvegarder dans la variable globale. Il n'est pas asynchrone, mais il peut aider.
un autre moyen de contourner le problème est de tirer parti des méthodes locales de bac à sable de sécurité Flash Player et ExternalInterface. On peut faire publier JavaScript request une application Flash en utilisant la seule sécurité locale sandbox pour charger le fichier à partir du disque dur, et Flash peut transmettre les données à JavaScript via la classe ExternalInterface de Flash. J'ai testé cela dans Chrome, FF et IE9, et cela fonctionne bien. Je serais heureux de partager le code, si quelqu'un est intéressé.
EDIT: j'ai commencé un code google (ironique?) projet de mise en œuvre: http://code.google.com/p/flash-loader /
@Mike sur Mac, tapez ceci dans le Terminal:
open -b com.google.chrome --args --disable-web-security
ce code fonctionnait très bien avec les feuilles.JSON localement avec browser-sync comme serveur local. -Mais sur mon serveur distant j'ai eu un 404 pour la feuille.fichier JSON utilisant Chrome. Ça a bien marché en Safari et en Firefox. -Changé le nom de la feuille.json à sheet.JSON. Puis ça a fonctionné sur le serveur distant. Quelqu'un d'autre ont cette expérience?
getthejason = function(){
var dataurl = 'data/sheet.JSON';
var xhr = new XMLHttpRequest();
xhr.open('GET', dataurl, true);
xhr.responseType = 'text';
xhr.send();
console.log('getthejason!');
xhr.onload = function() {
.....
}