jquery long polling:在数据实际更改之前阻止更新

时间:2013-02-26 11:22:38

标签: ajax json jquery jsonp

我创建了一个脚本,该脚本长时间轮询JSON源并使用结果更新div。我的代码发布在下面。

代码工作正常,我请求的数据被正确抓取和输出。代码检查JSON并获取2个图像和一些文本数据。

问题是它不断刷新数据并不断下载图像导致高服务器负载和带宽消耗(显然现在很小,但随着我完成我的项目会增加)。这也导致我无法选择div中的文本,并且图像在重新加载时闪烁,这两者都是我当前代码的不良后果。

我希望能够获取数据并显示它,并且在JSON响应中数据实际发生变化之前根本不更新数据,我假设我需要对时间戳做些什么?我已经尝试使用JSON中的first_aired密钥创建lastupdate时间戳,但它无法正常工作,我不确定我是否犯了错误,或者我是否正在咆哮错误的树。

有人可以看看我的代码,并指出我正确的方向,我需要做什么?

var lastupdate = 0;
// call getData when the document has loaded
$(document).ready(function(){
getData(lastupdate);
});
var getData = function(lastupdate) {
$.ajax({
  type: "GET",
  url: 'http://api.trakt.tv/user/watching.json/apikey/user/lastupdate='+lastupdate+'&callback=?',
  dataType: 'jsonp',
  async: true,
  cache: false,
  // timeout after 5 minutes, shut process down and restart
  timeout:300000,
  // process a successful response
  success: function(watching_now) {
    if (!jQuery.isEmptyObject(watching_now)) {
    //console.log(watching_now);
    var airDate = watching_now.episode.first_aired;
    var showTitle = watching_now.show.title;
    var showPoster = watching_now.show.images.poster;
    var showURL = watching_now.show.url;
    var episodeTitle = watching_now.episode.title;
    var episodeScreen = watching_now.episode.images.screen;
    var episodeNumber = watching_now.episode.number;
    var episodeSeason = watching_now.episode.season;
    $('#watching-now').html('<div class="screencap"><img src="' + episodeScreen +' " width="240" height="150" /></div><div class="poster"><a href="'+showURL+'" target="_blank"><img src="' + showPoster +'" width="85" height="120" /></a></div><div class="watching-info">'+episodeSeason+'x'+episodeNumber+' - '+episodeTitle+'</div>')
    }
    else {
    $('#watching-now').html('You are not currently watching anything')
    }
    // set lastupdate
    lastupdate = watching_now.airDate;
    // call again in 1 second
    setTimeout('getData('+lastupdate+');', 1000);
    },
    // handle error
  error: function(XMLHttpRequest, textStatus, errorThrown){
    // try again in 10 seconds if there was a request error
    setTimeout('getData('+lastupdate+');', 10000);
},
});
};

以下是我收到信息表格的JSON:

{"type":"episode","action":"watching","show":{"title":"Stargate Atlantis","year":2004,"url":"http://trakt.tv/show/stargate-atlantis","imdb_id":"tt0374455","tvdb_id":"70851","tvrage_id":"5324","first_aired":1089961200,"country":"United States","overview":"The story of Stargate Atlantis follows the cliffhanger episode on Stargate SG-1's seventh season finale \"Lost City\", where SG-1 found an outpost made by the race known as the Ancients in Antarctica. After the events of Stargate SG-1 season eight premiere \"New Order\", the Stargate Command sends an international team to investigate the outpost. Soon, Dr. Daniel Jackson discovers the location of the greatest city created by the Ancients, Atlantis. The story unfolds when the members of the expedition encounter the Wraith, the race that defeated the Ancients ten thousand years ago.","runtime":60,"network":"Syfy","air_day":"Monday","air_time":"9:00pm","certification":"TV-PG","images":{"poster":"http://trakt.us/images/posters/329.3.jpg","fanart":"http://trakt.us/images/fanart/329.3.jpg","banner":"http://trakt.us/images/banners/329.3.jpg"},"genres":["Action","Adventure","Science Fiction"]},"episode":{"season":3,"number":10,"title":"The Return (1)","overview":"The Atlantis expedition is stunned to learn that a ship full of Ancients is returning to reclaim their lost city. ","first_aired":1158908400,"url":"http://trakt.tv/show/stargate-atlantis/season/3/episode/10","images":{"screen":"http://trakt.us/images/episodes/329-3-10.3.jpg"}}}

如果您需要更多信息,请询问,我会尽我所能。

干杯

1 个答案:

答案 0 :(得分:1)

看看下面链接中显示的示例。

http://www.zeitoun.net/articles/comet_and_php/start

它的作用是传递时间戳并获得当前时间戳和传递时间戳之间的记录。