AJAXを使ってTwitter APIにアクセスする

Question

私はウェブアプリケーションでいくつかのtwitter関数を追加しようと考えているので、いくつかのテストを始めました。検索された単語/文が含まれているつぶやきを取得するために、検索TwitterのURL（詳細はhttp://dev.twitter.com/doc/get/search）を呼び出す方法を確認しました。 file_get_contents()関数を使って検索URLが返すJSONファイルをPHPで取得することができます。また、JavaScriptで直接スクリプトオブジェクトを作成し、それを本文に追加し、検索URLのコールバックパラメータを使用してデータを処理することもできます。

行うための別の方法は、それは私が最終的にそれをやった方法です：

---

メインのHTMLファイル：WEは、JSONデータをGET

<title>Twitter API JSON</title> 

<script type="text/javascript"> 

    //function that created the AJAX object 
function newAjax(){ 
     var xmlhttp=false; 
     try { 
     xmlhttp = new ActiveXObject("Msxml2.XMLHTTP"); 
     } catch (e) { 
     try { 
      xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); 
     } catch (E) { 
      xmlhttp = false; 
     } 
     } 
     if (!xmlhttp && typeof XMLHttpRequest!='undefined') { 
     xmlhttp = new XMLHttpRequest(); 
     } 
    return xmlhttp; 
} 

//function that search the tweets containing an specific word/sentence 
function gettweets(){ 

     ajax = newAjax(); 

    //ajax call to a php file that will search the tweets 
     ajax.open('GET', 'getsearch.php', true); 

     // Process the data when the ajax object changes its state 
     ajax.onreadystatechange = function() { 
     if(ajax.readyState == 4) { 
      if (ajax.status ==200) { //no problem has been detected 

     res = ajax.responseText; 
     //use eval to format the data 
     searchres = eval("(" + res + ")"); 

     resdiv = document.getElementById("result"); 
        //insert the first 10 items(user and tweet text) in the div 
     for(i=0;i<10;i++){ 
      resdiv.innerHTML += searchres.results[i].from_user+' says:<BR>'+searchres.results[i].text+'<BR><BR>'; 
     } 


      } 
     } 
     } 

    ajax.send(null); 
} //end gettweets function 

</script> 




#search_word Tweets 
<input type="button" onclick="gettweets();"value="search" /> 
<div id="result"> 
<BR> 
</div> 


</html> 

---

PHP：

$jsonurl = "http://search.twitter.com/search.json?q=%23search_word&rpp=10"; 

$json = file_get_contents($jsonurl,0,null,null); 

echo $json; 

---

これだけです。このように、うまくいきます。 PHPファイルを呼び出すと、検索URLから取得したJSONデータが返され、メインのHTML JavaScript関数ではdivにツイートが挿入されます。問題は初めてで、私はこのように、Ajaxを使って検索のURLを呼び出して、JavaScriptで直接それを実行しようとしましたということである。

メインのHTMLファイル：私はそれがJSONを返すべきと思っ

//same code above 

//ajax call to a php file that will search the tweets 
ajax.open('GET', 'http://search.twitter.com/search.json?q=%23search_word&rpp=10', true); 

//same code above 

データ、しかしそれはしません。どうして私は尋ねたいのですか？誰かがAjaxオブジェクトを使用してJSONデータを取得できない理由を知っていますか？検索URL http://search.twitter.com/search.json?q=%23search_word&rpp=10がJSONデータを返す場合は、ajaxオブジェクトで取得する必要があります。

Answer 1

ブラウザアドオンを使用していない限り、javascriptを使用してクロスドメイン要求を行うことはできません。

Answer 2

XHR要求は、通常、同じドメイン要求に限定されます。たとえば、bertsbees.comを利用している場合は、Ajaxメソッドを使用してtwitter.comからデータを取得することはできません。

つまり、TwitterのAPIはJSON-Pと呼ばれる普及したデータ転送方法をサポートしています。これは実際にほめたたかりの注入技術です。コールバックメソッドを渡すだけで、返されたデータは必要な関数にラップされ、evalされ、渡されます。