javascript - 如何每 10 秒发出一次 Ajax 请求(长轮询除外)？

Question

我正在尝试使用以下方法每 10 秒从服务器请求一个 json 对象:

setInterval(function(){
  $.ajax({
    url: '/',
    success: function(data){
      //do stuff with data
    }
  });
}, 10000);

但这不是很有效。我知道长轮询，但我不认为它会产生很大的不同。我知道我将每 10 秒接收一次新数据，所以这不会使长轮询在效率方面与 setInterval 完全相同吗？

浏览器端缓存是解决这个问题的好方法吗？

我将获得的 JSON 对象如下所示:

var data =  {1: {'user': 'John', 'age': '25'}, {2: {'user': 'Doe', 'age': '30'}}

有了这个，我想显示 data[0].user 几秒钟，然后通过使用 'fadeOut' 和 'fadeIn' 等将它平滑地更改为 data[1].user 直到它用完用户。我基本上想创建用户用户名的幻灯片。

缓存会是一个好的解决方案还是我应该坚持每 10 秒进行一次 ajax 调用？如果是，那么我将如何实现它，如果不是，我应该使用什么方法？

我不确定我是否解释得足够好，所以如果还有什么不清楚的地方请告诉我。

Answer 1

我肯定会考虑缓存。尤其是当您的设备有更多用户时，每 10 秒发出一次 AJAX 请求很容易使您的服务器过载。但是，如果您想保持简单，请每隔几分钟发出一次更新请求。缓存用户，将它们生成到 javascript 代码中，比如 users = new Array(user1, user2, ...)。如果页面不是那么重要，您实际上不必继续更新页面，因为大多数用户无论如何都会在一两分钟内离开。如果您有一个每隔几秒更改一次的长列表，那么您就有足够的时间不必使用 AJAX 进行更新，而只需依赖服务器生成的用户列表。

如果没有，将上次更新列表的时间存储在变量中，并在通过 AJAX 更新时将时间作为参数发送到服务器，然后让服务器快速检查添加了哪些新用户，以及只发送那些。然后，只需将新服务器的新阵列与旧阵列合并即可。不过，我强烈建议不要每 10 秒就给一个新名字打电话。你不仅会在你的服务器上运行更多的带宽，当它必须为你找到列表中的下一个用户，然后将那个用户发送给你时，你会增加 CPU 使用率。为了获得良好的实践，请始终让客户尽可能多地完成工作，不要有延迟。只有一台服务器，但有更多的客户端。您转移到客户端的每个操作都会为您的服务器节省数百(如果不是数千)操作。

至于长轮询与 setInterval，在那种情况下我建议使用 setInterval。您至少可以发送一个带有时间参数的请求，指定最后更新时间，因此只需要发送一小部分，而不是整个数据数组。

var storage = new Array(user1, user2, ...); //set all your data here, generate it from your server
var lastUpdate = //set the last time you updated it, just create a date variable

function rotateUsers()
{
    //do your fade in and fade out here
}

function update()
{
    //create a new HttpRequest, and then set the url as "yoursite.com/update?lastUpdateTime="+lastUpdate;
    //Take the response data, and merge the new users list with the old one
}
setInterval('rotateUsers()',10000);
setInterval('update()',60000); //update once a minute