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

使用AJAX提交消息并添加到数据库。

window.setInterval(function() { $.post("myscript.php", {action: "refresh", lastId: 1234}, function(response) { $("#discussion").prepend(response.html); lastId = response.lastId; }, "json"); }, 10000);
每隔几秒钟（即10秒钟）通过AJAX请求更新的消息并在讨论div之前添加（或追加）。

.oval { width: 10px;/*change here*/ height: 157px;/* or here if you want to be more sharper*/ border-radius: 50%; background: #1abc9c; }

Answer 2

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

使用＆＃34;正常＆＃34;轮询：在您的情况下，重复请求（例如每5秒）一个PHP脚本，以获取来自其他用户的最新消息。当您收到新消息时，请以相同方式将它们附加到消息列表中，然后在代码中执行此操作。
使用＆＃34;长轮询＆＃34;：您向php脚本发出ajax请求，但是没有立即回答。相反，使用PHP Sleep函数延迟了答案。您运行一个循环，检查您的消息存储（数据库，文件，...）是否有新消息，如果没有，您将进入休眠状态1秒（作为示例）。如果有新消息，则将其发送到浏览器。在这种情况下考虑最大的PHP脚本运行时间。使用此方法，可以降低服务器上的负载，因为您需要更少的HTTP调用。
使用websockets，它使用webbrowser和服务器之间的实时连接。这可能是完成您要执行的操作的最佳方法，但您需要在Web服务器上安装其他服务器软件。如果我没有弄错的话，使用PHP直接实现websockets是不可能的。 Here您找到了如何使用websockets的示例。

如果您需要使用纯PHP，选项2将是您的最佳选择。从技术角度来看，选项3是最近这样做的方法。选项1是＆＃34; old＆＃34;方式，不应该使用，因为服务器负载很高。

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

2 个答案: