使用jQuery和PHP的实时聊天系统

Question

我用jQuery和AJAX创建了聊天框，但问题是这个聊天框没有活动。如果你想得到最新的记录，你必须刷新页面。我的代码很简单，我想知道怎样才能让它正常运行。

这是我的jQuery脚本：

$('#textbox').keypress(function(event) {
    if(event.which == 13){
        $('#sendbutton').click();
        event.preventDefault();
    }
});

$('.chatwindow').load('load.php');

$('#post').submit(function() {
    var userid = "<?php echo $_SESSION["userid"]; ?>";
    var username = "<?php echo $_SESSION["username"]; ?>";
    var message = $('#textbox').val();

    $.post('post.php', { message: message, username: username, userid: userid }, function(data){ 
        $('.chatwindow').append('<span class="msg" >' + username + ': </span>' + data + '</span><br>');
        $('#textbox').val("");
        $('.chatwindow').scrollTop($('.chatwindow').prop('scrollHeight'));
    });
    return false;
})

Answer 1

1. 使用AJAX提交消息并添加到数据库中。 $.post("myscript.php", {userId: 123, message: "My message"});
2. 每隔几秒钟(即10秒)，通过AJAX请求更新消息，并在前面(或后面)添加讨论div。 window.setInterval(function() { $.post("myscript.php", {action: "refresh", lastId: 1234}, function(response) { $("#discussion").prepend(response.html); lastId = response.lastId; }, "json"); }, 10000);

Answer 2

在浏览器和服务器之间建立实时连接的可能性是不同的：

1. 使用“正常”轮询:重复请求(例如，每5秒一次)--在您的情况下--使用PHP脚本从其他用户获取最新消息。当您得到新消息时，以同样的方式将它们附加到消息列表中，您可以在代码中这样做。
2. 使用“长轮询”：向php脚本发出ajax请求，但这不会立即得到响应。相反，通过使用PHP睡眠函数来延迟答案。运行循环，检查消息存储(数据库、文件、.)对于新消息，如果没有消息，则需要睡眠1秒(举个例子)。如果有新消息，则将它们发送到浏览器。在本例中，考虑最大的php脚本运行时间。使用此方法，您可以降低服务器上的负载，因为您需要更少的HTTP调用。
3. 使用websockets，它使用and浏览器和服务器之间的实时连接。这可能是完成您想要做的事情的最佳方法，但是您需要在您的the服务器上安装一个额外的服务器软件。如果我没有弄错的话，直接用PHP实现websockets是不可能的。这里您可以找到一个如何使用websockets的示例。

如果您需要使用纯PHP，则选项2将是满足您的需要的最佳方法。从技术的角度来看，在这些日子里，选项3就是做到这一点的方法。选项1是“旧的”方式，不应该使用，因为服务器负载很高。