Question

我正在使用jquery ajax从twitter api中提取，我确信这是一种简单的方法，但是我找不到如何获取“推文”来呈现任何被推文的链接显示为链接。现在它只是文字。

$.ajax({  
            type : 'GET',  
            dataType : 'jsonp',  
            url : 'http://search.twitter.com/search.json?q=nettuts&rpp=2',  

            success : function(tweets) {  
               var twitter = $.map(tweets.results, function(obj, index) {  
                  return {  
                     username : obj.from_user,  
                     tweet : obj.text,  
                     imgSource : obj.profile_image_url,  
                     geo : obj.geo  
                  };  
               });

更新以下功能（插件）工作正常。

(function($) {

    $.socialFader = function(options) {

        var settings = {
            tweetHolder : null,
            tweetCount  : 100,
            fadeSpeed   : 500,
            tweetName: 'jquery'
        };  

        if (options) {
            $.extend(settings, options);
        };

        var URL = "http://search.twitter.com/search.json?q="+settings.tweetName+"&rpp=" + settings.tweetCount + "&callback=?";

        function relative_time(time_value) {

            var values = time_value.split(" ");
            time_value = values[1] + " " + values[2] + ", " + values[5] + " " + values[3];
            var parsed_date = Date.parse(time_value);
            var relative_to = (arguments.length > 1) ? arguments[1] : new Date();
            var delta = parseInt((relative_to.getTime() - parsed_date) / 1000);
            delta = delta + (relative_to.getTimezoneOffset() * 60);
            var r = '';
            if (delta < 60) {
                r = 'a minute ago';
            } else if(delta < 120) {
                r = 'couple of minutes ago';
            } else if(delta < (45*60)) {
                r = (parseInt(delta / 60)).toString() + ' minutes ago';
            } else if(delta < (90*60)) {
                r = 'an hour ago';
            } else if(delta < (24*60*60)) {
                r = '' + (parseInt(delta / 3600)).toString() + ' hours ago';
            } else if(delta < (48*60*60)) {
                r = '1 day ago';
            } else {
                r = (parseInt(delta / 86400)).toString() + ' days ago';
            }

         return r;

        };

        String.prototype.hashify = function() {
            return this.replace(/#([A-Za-z0-9\/\.]*)/g, function(m) {
                return '<a target="_new" href="http://twitter.com/search?q=' + m.replace('#','') + '">' + m + "</a>";
            });
        };

        String.prototype.linkify = function(){
            return this.replace(/[A-Za-z]+:\/\/[A-Za-z0-9-_]+\.[A-Za-z0-9-_:%&\?\/.=]+/, function(m) {
                return m.link(m);
            });
        };

        String.prototype.atify = function() {
            return this.replace(/@[\w]+/g, function(m) {
                return '<a href="http://www.twitter.com/' + m.replace('@','') + '">' + m + "</a>";
            });
        }; 

        $.getJSON(URL, function(JSON) {

            $.each(JSON.results, function(i, tweet) {

                var profilePicture = tweet.profile_image_url;
                var userLink = tweet.from_user;
                var text = tweet.text;
                text = text.linkify().atify().hashify();
                var createdAt = new Date(tweet.created_at);
                var myTweet = '<a href="http://www.twitter.com/' + userLink + '" title="' + userLink + '">' + userLink + '</a> ';
                myTweet += text;
                $(settings.tweetHolder).append('<li class="cycles">' + myTweet + '</li>');

            });

            var elements = $(settings.tweetHolder).children();
            var timeOutStart = 5000;

            function fader(elementId) {
                setTimeout(function() {
                    $(elements[elementId]).fadeOut(settings.fadeSpeed, function() {
                        $(elements[elementId + 1]).fadeIn(settings.fadeSpeed);
                    });
                }, timeOutStart * (elementId));
            };

            for (var j = 0; j < elements.length; j++) {
                           fader(j);
                       };

        });

    };

})(jQuery);

在我的准备声明中：

$.socialFader({ tweetHolder:"#twitter", tweetName:"nettuts", tweetCount:2 });

Answer 1

这是我写的一个插件，它真正简化了tweet / json聚合然后解析。它会使推文逐渐消失。只需抓住所需的代码即可。享受。

（函数（$）{

    $.socialFader = function(options) {

        var settings = {
            tweetHolder : null,
            tweetCount  : 99,
            fadeSpeed   : 500,
        };  

        if (options) {
            $.extend(settings, options);
        };

        var URL = "http://search.twitter.com/search.json?q=jquery&rpp=" + settings.tweetCount + "&callback=?";

        function relative_time(time_value) {

            var values = time_value.split(" ");
            time_value = values[1] + " " + values[2] + ", " + values[5] + " " + values[3];
            var parsed_date = Date.parse(time_value);
            var relative_to = (arguments.length > 1) ? arguments[1] : new Date();
            var delta = parseInt((relative_to.getTime() - parsed_date) / 1000);
            delta = delta + (relative_to.getTimezoneOffset() * 60);
            var r = '';
            if (delta < 60) {
                r = 'a minute ago';
            } else if(delta < 120) {
                r = 'couple of minutes ago';
            } else if(delta < (45*60)) {
                r = (parseInt(delta / 60)).toString() + ' minutes ago';
            } else if(delta < (90*60)) {
                r = 'an hour ago';
            } else if(delta < (24*60*60)) {
                r = '' + (parseInt(delta / 3600)).toString() + ' hours ago';
            } else if(delta < (48*60*60)) {
                r = '1 day ago';
            } else {
                r = (parseInt(delta / 86400)).toString() + ' days ago';
            }

         return r;

        };

        String.prototype.hashify = function() {
            return this.replace(/#([A-Za-z0-9\/\.]*)/g, function(m) {
                return '<a target="_new" href="http://twitter.com/search?q=' + m.replace('#','') + '">' + m + "</a>";
            });
        };

        String.prototype.linkify = function(){
            return this.replace(/[A-Za-z]+:\/\/[A-Za-z0-9-_]+\.[A-Za-z0-9-_:%&\?\/.=]+/, function(m) {
                return m.link(m);
            });
        };

        String.prototype.atify = function() {
            return this.replace(/@[\w]+/g, function(m) {
                return '<a href="http://www.twitter.com/' + m.replace('@','') + '">' + m + "</a>";
            });
        }; 

        $.getJSON(URL, function(JSON) {

            $.each(JSON.results, function(i, tweet) {

                var profilePicture = tweet.profile_image_url;
                var userLink = tweet.from_user;
                var text = tweet.text;
                text = text.linkify().atify().hashify();
                var createdAt = new Date(tweet.created_at);
                var myTweet = '<a href="http://www.twitter.com/' + userLink + '" title="' + userLink + '">' + userLink + '</a> ';
                myTweet += text;
                $(settings.tweetHolder).append('<li class="cycles">' + myTweet + '</li>');

            });

            var elements = $(settings.tweetHolder).children();
            var timeOutStart = 5000;

            function fader(elementId) {
                setTimeout(function() {
                    $(elements[elementId]).fadeOut(settings.fadeSpeed, function() {
                        $(elements[elementId + 1]).fadeIn(settings.fadeSpeed);
                    });
                }, timeOutStart * (elementId));
            };

            for (var j = 0; j < elements.length; j++) {
                fader(j);
            };

        });

    };

})(jQuery);

Answer 2

您需要解析推文内容，找到网址，然后将它们放在自己之间。

Answer 3

不幸的是，目前，搜索API没有像某些REST API方法那样突破tweet entities（即链接，提及，主题标签）的工具。因此，您可以自己解析实体（我使用正则表达式）或回调到其余API以获取实体。

如果您决定回调REST API，并且从搜索API结果中提取状态ID后，您可以调用statuses/show，如下所示：

http://api.twitter.com/1/statuses/show/60183527282577408.json?include_entities=true

在生成的JSON中，请注意实体对象。

"entities":{"urls":[{"expanded_url":null,"indices":[68,88],"url":"http:\/\/bit.ly\/gWZmaJ"}],"user_mentions":[],"hashtags":[{"text":"wordpress","indices":[89,99]}]}

您可以使用上面的内容来定位推文中的特定实体（出现在 indices 属性表示的字符串位置之间）并对其进行适当的转换。

如果您更喜欢自己解析实体，这里是我使用的（.NET Framework）正则表达式：

链接匹配模式

(?:<\w+.*?>|[^=!:'"/]|^)((?:https?://|www\.)[-\w]+(?:\.[-\w]+)*(?::\d+)?(?:/(?:(?:[~\w\+%-]|(?:[,.;@:][^\s$]))+)?)*(?:\?[\w\+%&=.;:-]+)?(?:\#[\w\-\.]*)?)(?:\p{P}|\s|<|$)

提及匹配模式

\B@([\w\d_]+)

标签匹配模式

(?:(?:^#|[\s\(\[]#(?!\d\s))(\w+(?:[_\-\.\+\/]\w+)*)+)

Twitter还提供open source library，可帮助捕获特定于Twitter的实体，如链接，提及和主题标签。 This java file包含定义Twitter使用的正则表达式的代码，this yml file包含测试字符串以及在Twitter库中运行正则表达式的许多单元测试的预期结果。

你如何处理推文取决于你，但是我处理原始推文的副本，并首先拉出所有链接，用空格替换它们（以免修改字符串长度。）我捕获字符串中匹配的开始和结束位置以及匹配的内容。然后我提取，然后是标签 - 再次用空格替换它们在推文副本中。

这种方法确保我不会在推文的任何链接中找到提及和主题标签的误报。

Answer 4

我略微修改了前一个。所有推文都一个接一个地消失，没有任何左倾。

现在它检查是否有任何可见的推文，然后刷新推文。

(function($) {

$.socialFader = function(options) {

    var settings = {
        tweetHolder : null,
        tweetCount  : 99,
        fadeSpeed   : 500,
    };  

    if (options) {
        $.extend(settings, options);
    };

    var URL = "http://search.twitter.com/search.json?q=istanbul&rpp=" + settings.tweetCount + "&callback=?";

    function relative_time(time_value) {

        var values = time_value.split(" ");
        time_value = values[1] + " " + values[2] + ", " + values[5] + " " + values[3];
        var parsed_date = Date.parse(time_value);
        var relative_to = (arguments.length > 1) ? arguments[1] : new Date();
        var delta = parseInt((relative_to.getTime() - parsed_date) / 1000);
        delta = delta + (relative_to.getTimezoneOffset() * 60);
        var r = '';
        if (delta < 60) {
            r = 'a minute ago';
        } else if(delta < 120) {
            r = 'couple of minutes ago';
        } else if(delta < (45*60)) {
            r = (parseInt(delta / 60)).toString() + ' minutes ago';
        } else if(delta < (90*60)) {
            r = 'an hour ago';
        } else if(delta < (24*60*60)) {
            r = '' + (parseInt(delta / 3600)).toString() + ' hours ago';
        } else if(delta < (48*60*60)) {
            r = '1 day ago';
        } else {
            r = (parseInt(delta / 86400)).toString() + ' days ago';
        }

     return r;

    };

    String.prototype.hashify = function() {
        return this.replace(/#([A-Za-z0-9\/\.]*)/g, function(m) {
            return '<a target="_new" href="http://twitter.com/search?q=' + m.replace('#','') + '">' + m + "</a>";
        });
    };

    String.prototype.linkify = function(){
        return this.replace(/[A-Za-z]+:\/\/[A-Za-z0-9-_]+\.[A-Za-z0-9-_:%&\?\/.=]+/, function(m) {
            return m.link(m);
        });
    };

    String.prototype.atify = function() {
        return this.replace(/@[\w]+/g, function(m) {
            return '<a href="http://www.twitter.com/' + m.replace('@','') + '">' + m + "</a>";
        });
    };


    $.getJSON(URL, function(JSON) {

        $(settings.tweetHolder).find('li.cycles').remove();

        $.each(JSON.results, function(i, tweet) {

            var profilePicture = tweet.profile_image_url;
            var userLink = tweet.from_user;
            var text = tweet.text;
            text = text.linkify().atify().hashify();
            var createdAt = new Date(tweet.created_at);
            var myTweet = '<a href="http://www.twitter.com/' + userLink + '" title="' + userLink + '">' + userLink + '</a> ';
            myTweet += text;
            $(settings.tweetHolder).append('<li class="cycles">' + myTweet + '</li>');

        });

        var elements = $(settings.tweetHolder).children();
        var timeOutStart = 5000;

        function fader(elementId) {


            setTimeout(function() {
                $(elements[elementId]).fadeOut(settings.fadeSpeed, function() {
                    $(elements[elementId + 1]).fadeIn(settings.fadeSpeed);
                });
                if (jQuery('#twitter ul li.cycles:visible').length==1) {
                    jQuery.socialFader({ tweetHolder:"#twitter ul", tweetCount:5 });
                }
            }, timeOutStart * (elementId));


        };

        for (var j = 0; j < elements.length; j++) {
            fader(j);
        };

    });

};

})(jQuery);
jQuery(document).ready(function(){
jQuery.socialFader({ tweetHolder:"#twitter ul", tweetCount:5 }); 
});

Twitter和jQuery，呈现推文链接

4 个答案: