2012-03-11 9 views
2

私は映画情報を取得するためにthemoviedb.org APIを使用しています。api.themoviedb.orgから返されたJSONP応答を解析する方法は?

var req = new XMLHttpRequest(); 
req.open("GET", "http://api.themoviedb.org/2.1/Movie.search/en/json/XXX/immortals?callback=foobar", true); 
req.send(); 
req.onreadystatechange=function() { 
    if (req.readyState==4 && req.status==200) { 
     console.log(req.responseText); 
    } 
} 

そして、私は、コンソールでこの応答を取得しています:

foobar([{"score":null,"popularity":3,"translated":true,"adult":false,"language":"ru","original_name":"Immortals","name":"Immortals","alternative_name":"\"War of the Gods\"","movie_type":"movie","i".......}]) 

がどのように私はname属性を取得するには、この応答を解析んこれは私が使用しているコードのですか?


更新:

は、誰もが、実際の答えはhippietrailによって与えられた、ありがとうございました。

eval(req.responseText) 

詳細:Filtering to specific nodes in JSON - use grep or map?

+0

**)**あなたはコールバック関数名( 'callback = foobar')を渡しましたが、あなたはそのコールバック関数を提供していません。 ** 2)**あなたは 'JSON'呼び出し(' GET')をしていますが、APIは 'JSONP'を提供しています。代わりに' script'タグの注入が必要です。APIは 'CORS'をサポートしていないので、' JSONP'だけがあなたの唯一のオプションです。 – hippietrail

+0

可能な重複:** [jqueryを使用してapiにjsonp呼び出しを行う方法](http://stackoverflow.com/questions/4221458/how-to-make-a-jsonp-call-to-an-api- using-jquery)** – hippietrail

+1

関連項目:** [JSON内の特定ノードへのフィルタリング - grepまたはmapを使用しますか?](http://stackoverflow.com/questions/7690168/filtering-to-specific-nodes-in-json -use-grep-or-map)** – hippietrail

答えて

3

あなたのページにこの機能を追加します。

(私はその配列を参照してください - 私は、各項目を繰り返すよ... - あなたがしたい場合最初のものは - そうご指定下さい)

function foobar(x) 
    { 
     $.each(x, function() 
     { 
      alert(this.score); 
     }); 

    } 

http://jsbin.com/ojomej/edit#javascript,html

。 10
+0

彼の場合、 'x [0] .name'であってはなりませんか? – Andy

+0

関数を単独で追加することは役に立ちません。あなたはまだistを呼び出す必要があります。返されたテキストをeval()するか、スクリプトを作成してDOMに添付してください。 – devnull69

+0

@Andy彼は最初のリクエストを要求しませんでした。私は彼にすべてを与える。彼はそれを分別すべきです。 –

0

これをテストするためのAPIキーはありませんが、jQueryでもJSONでもよくわからないようです。とにかく、このようなものは、あなたが始めるかもしれません:

$.getJSON("http://api.themoviedb.org/2.1/Movie.search/en/json/XXX/immortals?callback=?", 
    function(data) { 
     alert(data[0].name); 
    } 
); 
3

を使用しているURLは、(:http://en.wikipedia.org/wiki/JSONP参照)JSONP呼び出し用です。 JSONPは、XMLHttpRequestによるクロスドメイン要求が許可されていない場合に使用されます。しかし、すでにXMLHttpRequestを使用しているので、JSONP呼び出しは不要です。だから、あなたはURLからクエリ文字列を削除する場合:

var req = new XMLHttpRequest(); 
req.open("GET", "http://api.themoviedb.org/2.1/Movie.search/en/json/XXX/immortals", true); 

req.onreadystatechange=function() { 
    if (req.readyState==4 && req.status==200) { 
     console.log(req.responseText); 
    } 
} 

req.send(); 

をあなたは、JSON文字列を取得する必要があります:

あなたが JSON.parseを使用して解析することができます
[{"score":null,"popularity":3,"translated":true,"adult":false,"language":"ru","original_name":"Immortals","name":"Immortals","alternative_name":"\"War of the Gods\"","movie_type":"movie","i".......}] 

(参照:https://developer.mozilla.org/en/JSONを):

var data = JSON.parse(req.responseText); 

JavaScriptオブジェクトがあります。オブジェクトの配列には、次のものがあります。

console.log(data[0].name) // "Immortals" 

しかし、問題は、あなたがそのライブラリを使用している場合、あなたは多くのことを簡素化することができ、tagget「jqueryの」ですので:ブラウザの場合

$.getJSON("http://api.themoviedb.org/2.1/Movie.search/en/json/XXX/immortals", function (data) { 
    console.log(data[0].name) 
}); 

jqueryのも、ブラウザの違い(例えばの世話をしますJSONオブジェクトをサポートしていません)。

希望します。

+0

* "JSONPは、XMLHttpRequestによるクロスドメイン要求が許可されていない場合に使用されます" * JSONPが必要な理由は決して許されていません。 –

+0

OPが書いたコードでXMLHttpRequestを使用して実際の応答が得られた場合は、CORS http://en.wikipedia.org/wiki/Cross-origin_resource_sharingでクロスサイトリクエストが許可されていることを意味します。 – ZER0

+0

@amnotiam:あなたの情報は最新ではありません。ドメイン間のリクエストは、CORS' [Cross-origin resource sharing](http://en.wikipedia.org/wiki/Cross-origin_resource_sharing)をサポートしている場合に許可されます。 。現在のバージョンのOperaとInternet Explorerは標準を実装していませんが、次のバージョンのアップデートには両方とも対応します。 – hippietrail

関連する問題