Question

我使用php + ajax + mysql创建了一个聊天系统，它在获取和插入时工作正常，但无法重新加载新聊天。例如：用户＆＃39; x＆＃39;正在与用户聊天＆＃39; y因此，当用户x向y发送消息时，只有x的消息区域实时显示新发送的消息，而不是在y方面。同样的事情发生在y方面。我的jquery代码是：

 <script>  
 $(document).ready(function(){  
  $(document).on('click', '.first_name', function(){  
       var id=$(this).data("id1");  
       fetch_chat();
              function fetch_chat()  
                {  
                    $.ajax({  
                    url:"fetch_chat.php",  
                    method:"POST",  
                    data:{id:id},  
                    dataType:"text",  
                    success:function(data){  
                    $('#messages').html(data);  
                    $("div.area").show();
                    }     

                  });  
                }  


                $("#sub").off("click").on("click", function() {
                var text= $("#text").val();
                $.post('insert_chat.php',{id:id,msg:text},function(data){
                $("#messages").append(data);
                $("#text").val('');
                 });
            });

  });  
 });  
 </script>

Answer 1

Fisrt：将fetch_chat函数从onclick块中移出document.ready块。您在点击时定义了获取功能！

第二： Y人必须每隔1秒（例如）从服务器接收回复内容（例如javascript setInterval）。

但是如果你想尽快获取数据，那么有一种hack方法，即Y向服务器发送单个请求并等待服务器响应。在此方法中，您必须在服务器端创建重复任务，而不是在用户浏览器中重复任务。服务器任务向数据库发送定期请求，当获取新数据时，将其推送到人Y的排队请求。一旦Y收到响应，就向服务器发送新请求并再次等待接收响应。在此方法中，必须处理网络超时和服务器超时，或者您还可以从Y侧定义一个额外的间隔（长时间）以克服网络超时。

一个非常简单的服务器端响应模拟：

来自Y浏览器的请求：

$.ajax({
   url: 'serverside-fetch.php',
   success: function(data){
       $("#messages").append(data);
   }
})

从服务器响应 serverside-fetch.php ：

var data="";
while (data=="") {
   //data= fetch recent unread rows from chat database
}
echo data;

这是X方面的更正代码：

  $(document).on('click', '.first_name', function(){  
       var id=$(this).data("id1");  
       fetch_chat();

  });

   $("#sub").off("click").on("click", function() {
      var text= $("#text").val();
      $.post('insert_chat.php',{id:id,msg:text},function(data){
      $("#messages").append(data);
      $("#text").val('');
      });
   });

   function fetch_chat()  
    {  
        $.ajax({  
        url:"fetch_chat.php",  
        method:"POST",  
        data:{id:id},  
        dataType:"text",  
        success:function(data){  
          $('#messages').html(data);  
          $("div.area").show();
          }     
         });  
     }

重新加载提取的聊天区域

1 个答案: