0

Web サービスのリストを取得し、後でテーブルに表示する ajax リクエストを送信しています。ただし、コードは Firefox では正しく動作しますが、chorome と IE では動作しません。

AJAX リクエスト:

$.ajax({
   url: 'http://dev.ragld.com/services/',
   method: 'GET',
   accept: 'application/json',
   beforeSend: setHeader,
   async: false, 
   success: function(data){  
       var servicesObj = $.parseJSON(data);

       $.each(servicesObj, function(i, serviceItem){
           alert(serviceItem.name);
       });
   }
});

//function to setup header information
function setHeader(xhr){
    xhr.setRequestHeader('accept', 'application/json'); 
}

JSON レスポンス:

[
    {
        "name": "OS-ONS-bar",
        "type": "RelationshipService",
        "endpoint": "http://dev.ragld.com/services/bar/"
    },
    {
        "name": "OS-ONS-sameAs",
        "type": "RelationshipService",
        "endpoint": "http://dev.ragld.com/services/sameas/"
    },
    {
        "name": "Maths Service 2",
        "type": "ArithmeticService",
        "endpoint": "http://dev.ragld.com/services/arithmetic/"
    }
]

上記のコードでクロムに入るエラー：

Uncaught TypeError: Cannot read property 'length' of null jquery.min.js:2
e.extend.each jquery.min.js:2
$.ajax.success admin.php:157
f.Callbacks.o jquery.min.js:2
f.Callbacks.p.fireWith jquery.min.js:2
w jquery.min.js:4
f.support.ajax.f.ajaxTransport.send.d jquery.min.js:4
f.support.ajax.f.ajaxTransport.send jquery.min.js:4
f.extend.ajax jquery.min.js:4
(anonymous function) admin.php:148
f.Callbacks.o jquery.min.js:2
f.Callbacks.p.fireWith jquery.min.js:2
e.extend.ready jquery.min.js:2
c.addEventListener.B

問題:

  1. これは Firefox では正常に機能しますが、Chrome と IE では機能しません。
  2. これを削除する$.parseJSONと、chrome では動作しますが、firefox/IE では動作しません。

PS: ajax リクエストは別のサーバーに対して行われ、このコードは別の場所にあります。誰でもすべてのブラウザで動作する解決策を教えてください???

EDIT1: クロムは自動的にそれを解析するか、json ヘッダーを取得するように見えますが、Firefox では parseJSON を使用して明示的に解析する必要がありますか??? 何か案は？

EDIT2 (FireFox の console.log): 

[{"name":"OS-ONS-bar","type":"RelationshipService","endpoint":"http:\/\/dev.ragld.com\/services\/bar\/"},{"name":"OS-ONS-sameAs","type":"RelationshipService","endpoint":"http:\/\/dev.ragld.com\/services\/sameas\/"},{"name":"Maths Service 2","type":"ArithmeticService","endpoint":"http:\/\/dev.ragld.com\/services\/arithmetic\/"}]

Chrome からの console.log: ここに画像の説明を入力

4

1 に答える 1

3

ajax オプション dataTypeを「json」として指定する必要があります。そうしないと、jQuery は返すべきデータ型を推測する必要があり、さまざまな結果が得られる可能性があります。

データ・タイプ

何も指定されていない場合、jQuery は応答の MIME タイプに基づいてそれを推測しようとします (XML MIME タイプは XML を生成し、1.4 では JSON は JavaScript オブジェクトを生成し、1.4 ではスクリプトがスクリプトを実行します。文字列として返されます)。

FF、IE、Chrome で動作する私のデモをご覧ください。

XHR 応答を調べて、サービスが実際に JSON を返していることを確認する必要があります。

于 2012-09-13T12:04:55.420 に答える