javascript - 如何使用 jQuery 实现通知系统？

Question

我有一个通知区域，当有人发送消息时我想更新，例如使用 jQuery 或 Ajax（我的数据库在肥皂服务器中）我想每隔一秒左右进行一次肥皂调用，我该怎么做？

Answer 1

而不是setInterval()，我强烈建议使用setTimeout().

MDN 解释：

如果您的逻辑执行时间可能比间隔时间长，建议您使用递归调用命名函数window.setTimeout。例如，如果使用 setInterval 每 5 秒轮询一次远程服务器，网络延迟、服务器无响应以及许多其他问题可能会阻止请求在分配的时间内完成。因此，您可能会发现排队的 XHR 请求不一定按顺序返回。

对于这种情况，递归setTimeout模式是首选：

(function loop(){    
    setTimeout(function(){

        // logic here

        // recurse
        loop();
    }, 1000); 
})(); 

在上面的代码片段中，声明了一个命名函数循环并立即执行。 在逻辑完成执行后在loop内部递归调用。setTimeout虽然此模式不保证在固定间隔上执行，但它确实保证前一个间隔在递归之前已经完成。

Answer 2

您可以使用简单的setInterval结构以预定义的时间间隔执行 AJAX 调用。像这样的东西：

setInterval(function(){
  $.get('ajax_responder.php',dataObj,function(){
    // ajax callback
    // here is where you would update the user with any new notifications.
  });
},5000);

前面的代码将每 5000 毫秒（每 5 秒）执行一次 AJAX 请求。

参考：

• $.get()
• setInterval()

Answer 3

实时网络的最佳方式是node.js。

Node.js 是一个基于 Chrome 的 JavaScript 运行时构建的平台，用于轻松构建快速、可扩展的网络应用程序。Node.js 使用事件驱动的非阻塞 I/O 模型，使其轻量且高效，非常适合跨分布式设备运行的数据密集型实时应用程序。

但是您可以通过setInterval 或 setTimeout来完成，在您的间隔中放置一个Ajax调用。

var intval = setInterval( function() 
{
   $.get('url.php',  {data1: "value1", data2: "value2"},  
   function(response)
   {  
            // response  
   });  
}, 1000);