1

我自己正在使用 HTML5 和 CSS3 创建一个网站。我正在使用 jquery.tweet.js javascript 文件将我的 twitter 提要显示到我的网站中。而且,我在我的 body 元素中添加了下面的 jQuery 代码:

<script>
    jQuery(document).ready(function($) {
        $('#latest-tweets').tweet({
            username: 'sumonbdinfo',
            count:1,
            loading_text: "loading tweets..."
        });
    });
</script>

但是,在我的网站上现在才显示“正在加载推文......”文本,不再显示我的 Twitter 订阅源。

此外,我将 jquery.tweet.js 文件添加到我的 head 元素中,并将 jquery 添加到我的 head 元素中。但是,它仍然没有显示在我的网站上。

我应该将上面的代码放入我网站的 head 元素中,还是只是将其添加到正确的位置?

我在 jquery.tweet.js 文件下面粘贴了我用来在我的网站上显示推文的内容。

(function(a){a.fn.tweet=function(c){var n=a.extend({username:null,list:null,favorites:false,query:null,avatar_size:null,count:3,fetch:null,page:1,retweets:true,intro_text:null,outro_text:null,join_text:null,auto_join_text_default:"i said,",auto_join_text_ed:"i",auto_join_text_ing:"i am",auto_join_text_reply:"i replied to",auto_join_text_url:"i was looking at",loading_text:null,refresh_interval:null,twitter_url:"twitter.com",twitter_api_url:"api.twitter.com",twitter_search_url:"search.twitter.com",template:"{avatar}{time}{join}{text}",comparator:function(p,o){return o.tweet_time-p.tweet_time},filter:function(o){return true}},c);var b=/\b((?:[a-z][\w-]+:(?:\/{1,3}|[a-z0-9%])|www\d{0,3}[.]|[a-z0-9.\-]+[.][a-z]{2,4}\/)(?:[^\s()<>]+|\(([^\s()<>]+|(\([^\s()<>]+\)))*\))+(?:\(([^\s()<>]+|(\([^\s()<>]+\)))*\)|[^\s`!()\[\]{};:'".,<>?«»“”‘’]))/gi;function l(q,r){if(typeof q==="string"){var o=q;for(var p in r){var s=r[p];o=o.replace(new RegExp("{"+p+"}","g"),s===null?"":s)}return o}else{return q(r)}}a.extend({tweet:{t:l}});function f(p,o){return function(){var q=[];this.each(function(){q.push(this.replace(p,o))});return a(q)}}function k(o){return o.replace(/</g,"&lt;").replace(/>/g,"^&gt;")}a.fn.extend({linkUser:f(/(^|[\W])@(\w+)/gi,'$1@<a href="http://'+n.twitter_url+'/$2">$2</a>'),linkHash:f(/(?:^| )[\#]+([\w\u00c0-\u00d6\u00d8-\u00f6\u00f8-\u00ff\u0600-\u06ff]+)/gi,' <a href="http://'+n.twitter_search_url+"/search?q=&tag=$1&lang=all"+((n.username&&n.username.length==1&&!n.list)?"&from="+n.username.join("%2BOR%2B"):"")+'">#$1</a>'),capAwesome:f(/\b(awesome)\b/gi,'<span class="awesome">$1</span>'),capEpic:f(/\b(epic)\b/gi,'<span class="epic">$1</span>'),makeHeart:f(/(&lt;)+[3]/gi,"<tt class='heart'>&#x2665;</tt>")});function e(p,o){return p.replace(b,function(s){var r=(/^[a-z]+:/i).test(s)?s:"http://"+s;var u=s;for(var t=0;t<o.length;++t){var q=o[t];if(q.url==r&&q.expanded_url){r=q.expanded_url;u=q.display_url;break}}return'<a href="'+k(r)+'">'+k(u)+"</a>"})}function j(o){return Date.parse(o.replace(/^([a-z]{3})( [a-z]{3} \d\d?)(.*)( \d{4})$/i,"$1,$2$4$3"))}function h(o){var q=(arguments.length>1)?arguments[1]:new Date();var s=parseInt((q.getTime()-o)/1000,10);var p="";if(s<1){p="just now"}else{if(s<60){p=s+" seconds ago"}else{if(s<120){p="a minute ago"}else{if(s<(45*60)){p=(parseInt(s/60,10)).toString()+" minutes ago"}else{if(s<(2*60*60)){p="an hour ago"}else{if(s<(24*60*60)){p=""+(parseInt(s/3600,10)).toString()+" hours ago"}else{if(s<(48*60*60)){p="a day ago"}else{p=(parseInt(s/86400,10)).toString()+" days ago"}}}}}}}return"about "+p}function g(o){if(o.match(/^(@([A-Za-z0-9-_]+)) .*/i)){return n.auto_join_text_reply}else{if(o.match(b)){return n.auto_join_text_url}else{if(o.match(/^((\w+ed)|just) .*/im)){return n.auto_join_text_ed}else{if(o.match(/^(\w*ing) .*/i)){return n.auto_join_text_ing}else{return n.auto_join_text_default}}}}}function d(){var p=("https:"==document.location.protocol?"https:":"http:");var o=(n.fetch===null)?n.count:n.fetch;var r="&include_entities=1&callback=?";if(n.list){return p+"//"+n.twitter_api_url+"/1/"+n.username[0]+"/lists/"+n.list+"/statuses.json?page="+n.page+"&per_page="+o+r}else{if(n.favorites){return p+"//"+n.twitter_api_url+"/favorites/"+n.username[0]+".json?page="+n.page+"&count="+o+r}else{if(n.query===null&&n.username.length==1){return p+"//"+n.twitter_api_url+"/1/statuses/user_timeline.json?screen_name="+n.username[0]+"&count="+o+(n.retweets?"&include_rts=1":"")+"&page="+n.page+r}else{var q=(n.query||"from:"+n.username.join(" OR from:"));return p+"//"+n.twitter_search_url+"/search.json?&q="+encodeURIComponent(q)+"&rpp="+o+"&page="+n.page+r}}}}function m(o,p){if(p){return("user" in o)?o.user.profile_image_url_https:m(o,false).replace(/^http:\/\/[a-z0-9]{1,3}\.twimg\.com\//,"https://s3.amazonaws.com/twitter_production/")}else{return o.profile_image_url||o.user.profile_image_url}}function i(p){var q={};q.item=p;q.source=p.source;q.screen_name=p.from_user||p.user.screen_name;q.avatar_size=n.avatar_size;q.avatar_url=m(p,(document.location.protocol==="https:"));q.retweet=typeof(p.retweeted_status)!="undefined";q.tweet_time=j(p.created_at);q.join_text=n.join_text=="auto"?g(p.text):n.join_text;q.tweet_id=p.id_str;q.twitter_base="http://"+n.twitter_url+"/";q.user_url=q.twitter_base+q.screen_name;q.tweet_url=q.user_url+"/status/"+q.tweet_id;q.reply_url=q.twitter_base+"intent/tweet?in_reply_to="+q.tweet_id;q.retweet_url=q.twitter_base+"intent/retweet?tweet_id="+q.tweet_id;q.favorite_url=q.twitter_base+"intent/favorite?tweet_id="+q.tweet_id;q.retweeted_screen_name=q.retweet&&p.retweeted_status.user.screen_name;q.tweet_relative_time=h(q.tweet_time);q.entities=p.entities?(p.entities.urls||[]).concat(p.entities.media||[]):[];q.tweet_raw_text=q.retweet?("RT @"+q.retweeted_screen_name+" "+p.retweeted_status.text):p.text;q.tweet_text=a([e(q.tweet_raw_text,q.entities)]).linkUser().linkHash()[0];q.tweet_text_fancy=a([q.tweet_text]).makeHeart().capAwesome().capEpic()[0];q.user=l('<a class="tweet_user" href="{user_url}">{screen_name}</a>',q);q.join=n.join_text?l(' <span class="tweet_join">{join_text}</span> ',q):" ";q.avatar=q.avatar_size?l('<a class="tweet_avatar" href="{user_url}"><img src="{avatar_url}" height="{avatar_size}" width="{avatar_size}" alt="{screen_name}\'s avatar" title="{screen_name}\'s avatar" border="0"/></a>',q):"";q.time=l('<span class="tweet_time"><a href="{tweet_url}" title="view tweet on twitter">{tweet_relative_time}</a></span>',q);q.text=l('<span class="tweet_text">{tweet_text_fancy}</span>',q);q.reply_action=l('<a class="tweet_action tweet_reply" href="{reply_url}">reply</a>',q);q.retweet_action=l('<a class="tweet_action tweet_retweet" href="{retweet_url}">retweet</a>',q);q.favorite_action=l('<a class="tweet_action tweet_favorite" href="{favorite_url}">favorite</a>',q);return q}return this.each(function(p,s){var r=a('<ul class="tweet_list">');var q='<p class="tweet_intro">'+n.intro_text+"</p>";var o='<p class="tweet_outro">'+n.outro_text+"</p>";var t=a('<p class="loading">'+n.loading_text+"</p>");if(n.username&&typeof(n.username)=="string"){n.username=[n.username]}a(s).bind("tweet:load",function(){if(n.loading_text){a(s).empty().append(t)}a.getJSON(d(),function(u){a(s).empty().append(r);if(n.intro_text){r.before(q)}r.empty();var v=a.map(u.results||u,i);v=a.grep(v,n.filter).sort(n.comparator).slice(0,n.count);r.append(a.map(v,function(w){return"<li>"+l(n.template,w)+"</li>"}).join("")).children("li:first").addClass("tweet_first").end().children("li:odd").addClass("tweet_even").end().children("li:even").addClass("tweet_odd");if(n.outro_text){r.after(o)}a(s).trigger("loaded").trigger((v.length===0?"empty":"full"));if(n.refresh_interval){window.setTimeout(function(){a(s).trigger("tweet:load")},1000*n.refresh_interval)}})}).trigger("tweet:load")})}})(jQuery);

所以,请帮助我,我该如何解决这个问题?这对我来说真的很有帮助。在这里等待任何人的答案!

4

3 回答 3

3

你不能继续使用 seaofclouds tweet.js 并期望像上个月那样拉推文。造成这种情况的原因是 twitter 1.0 api 最近被 1.1 取代 - https://dev.twitter.com/blog/api-v1-is-retiredjquery.tweet.js的作者在这里谈论 API 的变化和他的插件的状态:https ://github.com/seaofclouds/tweet/#important-note-about-twitters-api-changes-in-2013和可以在此处找到单独的讨论:https ://github.com/seaofclouds/tweet/issues/264以及替代方案(有效) - https://github.com/StanScates/Tweet.js-Mod

Tweet.js-Mod是原始jquery.tweet.js的修改版本,并使用 php 脚本访问 twitter 的 API 版本 1.1。

安装说明可以在这里找到:https ://github.com/StanScates/Tweet.js-Mod#how-to-use

于 2013-06-22T17:31:25.623 回答
1

让我警告您有关使用 https://github.com/StanScates/Tweet.js-Mod#how-to-use 它运行良好,但您的网站运行的一些客户可能会出现此错误

错误:

XMLHttpRequest 无法加载http://api.getmytweets.co.uk/?screenname=philipbeel&limit=5&undefined=undefined。Access-Control-Allow-Origin 不允许来源http://plugins.theodin.co.uk 。

此外,此方法不使用 Oauth 方法,您的安全性可能会受到影响。Twitter 强烈反对使用客户端身份验证。

您的解决方案有 2 个部分

  1. 使用基于 php 的 Oauth 脚本以 JSON 格式检索推文
  2. 使用 Jquery 格式化 JSON 并将其显示到您的网站中

简单安全。

这是一个完整的教程 http://www.webdevdoor.com/javascript-ajax/custom-twitter-feed-integration-jquery/

于 2013-07-12T14:30:23.313 回答
1

看起来这是 Twitter 处理请求的方式的一个重大变化,他们的 API 1.0 版允许未经身份验证的请求,但现在这已经改变了 Twitter 推动开发人员使用他们的嵌入式时间线的地方,这需要身份验证。

讨论 Twitter 从 v1.0 到 v1.1 的过渡

于 2013-06-22T17:20:56.423 回答