web-dev-qa-db-ja.com

Chromeでローカルファイルを使用するjQuery getJSONの問題

非常に単純なテストページ があり、jQueryの$ .getJSONおよび$ .ajaxメソッドでXHRリクエストを使用しています。同じページがいくつかの状況で機能し、他の状況では機能しません。具体的には、UbuntuのChromeでは機能しません。

Ubuntu 9.10でChrome= 5.0.342.7ベータ版、Mac OSX 10.6.2でChrome 5.0.307.9ベータ版。

  • Ubuntu/ChromeとMac/Chromeの両方からWebサーバーにファイルをインストールすると、正常に動作します（ ここで試してみてください ）。
  • Mac/Chromeのローカルハードドライブにファイルをインストールすると、正常に機能します（file：/// ...でアクセスします）。
  • It[〜＃〜] fails [〜＃〜]Ubuntu/Chromeのローカルハードドライブにファイルがインストールされている場合（file：///でアクセス） ...）。

3つのファイルの小さなセットは、ここからtar/gzipファイルでダウンロードできます。 http://issues.tauren.com/testjson/testjson.tgz

動作すると、Chromeコンソールは次のように表示します。

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

動作しない場合、Chromeコンソールはこれを表示します：

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

成功ハンドラーは実行されますが、XHRリクエストも表示されないことに注意してください。これは以前Ubuntu/Chromeで機能していたと断言し、何かが台無しになるのではないかと心配しています。既にChromeをアンインストールして再インストールしましたが、助けにはなりませんでした。

誰かがあなたのUbuntuシステムでローカルに試してみて、何か問題があれば教えてもらえますか？ Firefoxでは正常に動作しているように見えることに注意してください。

ajaxjsonjquerygoogle-chrome
48
Tauren

これはChromeの既知の問題です。

バグトラッカーのリンクは次のとおりです。

問題40787：ローカルファイルがAjaxで読み込まれない

30
Daniel Furrer

別の方法は、ディレクトリでローカルHTTPサーバーを起動することです。 UbuntuとMacOでPythonがインストールされている場合、これはワンライナーです。

Webファイルを含むディレクトリに移動し、次の操作を行います。

python -m SimpleHTTPServer

次に、Webブラウザーで http：// localhost：8000/index.html に接続して、ページをテストします。

38
Sébastien RoccaSerra

Windowsでは、ChromeはAppDataフォルダーにインストールされる可能性があります。

「C：\ Users \\ AppData\Local\Google\Chrome\Application」

コマンドを実行する前に、すべてのChromeウィンドウがclosedであり、それ以外の場合は実行されていないことを確認してください。

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

Jsonをjsファイルに配置し、グローバル変数に保存できます。非同期ではありませんが、役立ちます。

3
Zdeněk Mlčoch

@Mike Macでは、ターミナルに次のように入力します。

open -b com.google.chrome --args --disable-web-security
1
Shazron

このコードは、ローカルサーバーとしてbrowser-syncを使用してsheet.jsonlocalで正常に機能しました。 -しかし、リモートサーバーでChromeを使用してsheet.jsonファイルの404を取得しました。 SafariおよびFirefoxで正常に機能しました。 -sheet.jsonという名前をsheet.JSONに変更しました。その後、リモートサーバーで機能しました。他に誰もこの経験がありますか？

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() {
.....
}
1
Luke Dohner

この問題を回避する追加の方法は、Flash PlayerのLocal OnlyセキュリティサンドボックスおよびExternalInterfaceメソッドを活用することです。 Local Onlyセキュリティサンドボックスを使用してパブリッシュされたFlashアプリケーションにJavaScriptを要求して、ハードドライブからファイルをロードし、FlashがFlashのExternalInterfaceクラスを介してJavaScriptにデータを返すことができます。これをChrome、FF、およびIE9でテストしましたが、うまく機能します。誰かが興味を持っているなら、私はコードを共有したいです。

EDIT：実装のためにGoogleコード（ironic？）プロジェクトを開始しました： http://code.google.com/ p/flash-loader /

1
CommissarXiii