如何在Twitter嵌入时间线刷新之前设置超时?

时间:2013-11-07 17:43:38

标签: javascript jquery html performance twitter

如何在Twitter嵌入时间线刷新之前设置超时?

我需要更改超时时间以更新我网站上的推特时间线。 目前twitter API每秒都会执行ajax请求来更新时间轴。 但是在JS的引擎较慢的浏览器(换句话说:IE)上,导致浏览器变慢或者有时会导致浏览器停止工作。

要解决此问题,我想在Twitter时间线刷新之前设置超时

我没有在API上找到关于我如何做到这一点的任何参考。

我正在使用以下JS代码导入时间轴:

<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p='https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p "://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>

要显示时间表,我正在使用如下所示的HTML代码:

<div class="box-twitter">
<p class="title-box"><span class="icon"></span>WHAT'S HAPPENING ON TWITTER </p>
<a class="twitter-timeline"  href="https://twitter.com/search?q=from:dev include:retweets"  data-widget-id="394816085830025216"><img src="preloader.gif" style="margin-left: 132px; margin-top: 20px;"/></a>

有人知道我该如何解决这个问题?

感谢。

2 个答案:

答案 0 :(得分:2)

我认为设置Tweet limit可能是一种选择。

推文限制: To fix the size of a timeline to a preset number of Tweets, use the data-tweet-limit =“5”属性 with any value between 1 and 20 Tweets. The timeline will render the specified number of Tweets from the timeline, expanding the height of the widget to display all Tweets without scrolling. 由于小部件是固定的大小,使用此选项时不会轮询更新。

https://dev.twitter.com/docs/embedded-timelines

e.g。

<a class="twitter-timeline" href="https://twitter.com/twitterapi" data-widget-id="YOUR-WIDGET-ID-HERE" data-chrome="nofooter" data-tweet-limit="3">Tweets by @twitterapi</a>

然后如果需要,你可以手动更新你的小部件,方法是删除他们重新插入html然后调用。

twttr.widgets.load()

答案 1 :(得分:2)

在Twitter上提供的widget.js文件上进行逆向工程。 我找到了一个名为'schedulePolling'的方法,代码如下:

schedulePolling: function(e) {
var t = this;
if (this.pollInterval === null) return;
e = twttr.widgets.poll || e || this.pollInterval || 1e4, e > -1 && window.setTimeout(function() {
    this.isUpdating || t.update(), t.schedulePolling()
}, e)

为了增加超时,我在此代码中添加了固定值。

schedulePolling: function(e) {
var t = this;
if (this.pollInterval === null) return;
e = 60000 || e || this.pollInterval || 1e4, e > -1 && window.setTimeout(function() {
    this.isUpdating || t.update(), t.schedulePolling()
}, e)}

我已经替换了代码twttr.widgets.poll 在我想要'60000'的时候;

执行此操作后,使用我的自定义代码保存widget.js。

因此,在此自定义之后,我修改了导入Twitter API的行,将默认值//platform.twitter.com/widgets.js更改为自定义文件my-site/js/customized_widgets.js的路径。

结果就是这样。

<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p='https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+"/my-site/js/customized_widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>