Javascriptを使用してTwitterのJsonテキストを解析する

Question

Twitterから返されたJSONフィードテキストを解析するのに助けが必要です。私はアクセスし、リンク、created_date、および他の情報にスタイルタグを適用する必要があります。どのようにこれを達成するためのヒント？事前に感謝

Answer 1

Googleで

まず結果：

Ralph Whitbeck - Blog - Pulling twitter updates with JSON and jQuery。以下のコード：

var url = "http://twitter.com/status/user_timeline/RedWolves.json?count=3&callback=?"; 
$.getJSON(url, function(data){ 
    $.each(data, function(i, item) { 
     $("img#profile").attr("src", item.user["profile_image_url"]); 
     $("#tweets ul").append("<li>" 
           + item.text.linkify() 
           + " <span class='created_at'>" 
           + relative_time(item.created_at) 
           + " via " 
           + item.source 
           + "</span></li>"); 
    }); 
}); 

とHTML：

<div id="tweets"> 
    <img id="profile"> 
    <ul></ul> 
</div> 

別の例。 Fetching tweets with jQuery and the Twitter JSON API。以下を再現しています：

$(document).ready(function() { 
    // Declare variables to hold twitter API url and user name 
    var twitter_api_url = 'http://search.twitter.com/search.json'; 
    var twitter_user = 'lupomontero'; 

    // Enable caching 
    $.ajaxSetup({ cache: true }); 

    // Send JSON request 
    // The returned JSON object will have a property called "results" where we find 
    // a list of the tweets matching our request query 
    $.getJSON(
    twitter_api_url + '?callback=?&rpp=5&q=from:' + twitter_user, 
    function(data) { 
     $.each(data.results, function(i, tweet) { 
     // Uncomment line below to show tweet data in Fire Bug console 
     // Very helpful to find out what is available in the tweet objects 
     //console.log(tweet); 

     // Before we continue we check that we got data 
     if(tweet.text !== undefined) { 
      // Calculate how many hours ago was the tweet posted 
      var date_tweet = new Date(tweet.created_at); 
      var date_now = new Date(); 
      var date_diff = date_now - date_tweet; 
      var hours  = Math.round(date_diff/(1000*60*60)); 

      // Build the html string for the current tweet 
      var tweet_html = '<div class="tweet_text">'; 
      tweet_html += '<a href="http://www.twitter.com/'; 
      tweet_html += twitter_user + '/status/' + tweet.id + '">'; 
      tweet_html += tweet.text + '<\/a><\/div>'; 
      tweet_html += '<div class="tweet_hours">' + hours; 
      tweet_html += ' hours ago<\/div>'; 

      // Append html string to tweet_container div 
      $('#tweet_container').append(tweet_html); 
     } 
     }); 
    } 
); 
}); 

Answer 2

を参照してください、それは特にこれのために作られています$.jsonを見てください。これはコールバックで使用されるjsonを自動的に解析して（配列に）返すajax呼び出しです。

Answer 3

あなたがHTMLにJSONを変換したい場合は、素敵なテンプレートエンジンがあります：tempo js

Answer 4

サーバー側で解析するほうがはるかに簡単ですが、サイト全体をクライアント側で行っていると思いますか？

サンプルJavascriptを：Twitterのとそう

//store your JSON into a variable 
    var yourJSON = {"animals": 
         [ {"type": "dog", "name": "Paul"}, 
         {"type": "cat", "name": "Ralph"}, 
         {"type": "bird", "name": "Jim"} ] 
        }; 

    //retrieve data and store into variables (do with them what you will) 
    var PaulsType = yourJSON.animals[0].type; //returns 'dog' 
    var BirdsName = yourJSON.animals[2].name; //returns 'Jim' 

、そこにカプセル化の多くのレベルがあるので、あなたはそれに応じて調整する必要があります。たとえば、あなたのフォロワーを取得するために、あなたはこのようなものがあるでしょう：

[{ "statuses_count"：527、 "profile_use_background_image"：真、....
....
、 "ステータス"： {"place"：null、 "retweeted_status"：{"place"：null、 "coordinates"：null、 "retweet_count"： "100 +"、 "truncated"：false、 "text"： "BLAHBLAHBLAH" ....あなたがあなたの最初のフォロワーの最新のつぶやき（最近あなたを追った人）のテキストを返すしたい場合。

だからこれは単にインデックス0を示している、あなたは、このようなJavaScriptを使用する必要があると思います。代わりに、サーバ側のクライアント側からTwitterのAPIにアクセスするための十分な理由があります

Answer 5

var yourJSON = {put Twitter output here}; 
var firstFollowersTweet_retweet = yourJSON[0].status.retweeted_status.text; 

//to get raw text whether retweet or not 
var firstFollowersTweet = yourJSON[0].status.text; 

POW：この例では、つぶやきは、（カプセル化の使用を表示する）リツイートです。 PHPを使用してサーバー側でAPIにアクセスしている場合、サーバーのIPはTwitterによってレート制限されている可能性があります。さらに、Twitterではレート制限が公開されていないようです。

REST APIを使用しても、未知数の（潜在的に多数の）ユーザーのサイトを作成するには限界がありません。これはスケーラブルではありません。

JavaScriptを使用すると、クライアントがデータを要求するのが簡単になる場合があります。

各クライアントにOAuthを設定し、独自のAPI-Limitを使用することは可能ですが、いくつかのつぶやきを取得するためには頭痛があります。私が思うに、一般的な使い方は簡単なバイパス方法です。