我确信由于服务器断开连接并重新连接,我的聊天应用程序正在受到影响。它应该过滤重复的消息,并且大部分都是这样做的。但是,当两个(或更多)相互发送消息的用户同时连接时,他们的消息似乎重复。如果只有一个用户正在查看其消息,则不会发生这种情况。该应用程序正在使用服务器端事件JavaScript API。
无论如何,有没有办法保持连接活着?或者解决这个问题的方法?可能通过服务器端消息过滤?
客户端:
function chat() {
if (document.getElementById('chat').style.display == "none" || document.getElementById('chat').className != "on") {
if (window.matchMedia("screen and (max-width: 800px)").matches) {
document.getElementById('content').className = 'off';
document.getElementById('chat').className = "on";
if (document.getElementById('coverPhoto')) {document.getElementById('coverPhoto').className = 'off';}
} else {
document.getElementById('chat').style.display = 'block';
}
document.getElementById('chatBox').contentDocument.designMode = 'On';
if (typeof(EventSource) !== "undefined") {
var source = new EventSource('/ajax/gMessages.php'), last_id, used = {};
source.addEventListener('message', function(event) {
var now_id = event.lastEventId;
if (last_id != now_id && document.getElementById('chatMsgs').innerHTML != event.data) {
last_id = event.lastEventId;
if (!used[event.data]) {
document.getElementById('chatMsgs').innerHTML += event.data;
used[event.data] = 1;
document.getElementById('chat').scrollTop = document.getElementById('chat').scrollHeight; //keep scrollbar at the bottom
}
}
}, false);
}
} else if (document.getElementById('chat').style.display == "block" || document.getElementById('chat').className != "off") {
if (window.matchMedia("screen and (max-width: 800px)").matches) {
document.getElementById('content').className = 'on';
document.getElementById('chat').className = 'off';
if (document.getElementById('coverPhoto')) {document.getElementById('coverPhoto').className = 'on';}
} else {
document.getElementById('chat').style.display = "block";
}
}
}
服务器端:
<?php
session_start();
header('Content-Type: text/event-stream');
header('Cache-Control: no-cache');
set_time_limit(0);
include "../includes/config.php";
include "../includes/date.php";
function getMessages() {
$con = new PDO(DB_DSN, DB_USERNAME, DB_PASSWORD);
$con->exec("SET CHARACTER SET utf8");
$getMsgs = "SELECT * FROM `messages` WHERE `msg_to` = '$_SESSION[username]' AND `type` = '0' ORDER BY `sent` ASC";
$receivedMsgs = $con->query($getMsgs);
foreach ($receivedMsgs->fetchAll() as $msg) {
$getUI = "SELECT `profile_pic`, `full_name`, `username` FROM `users` WHERE `username` = '$msg[msg_from]'";
$uiQuery = $con->query($getUI);
while ($UI = $uiQuery->fetch(PDO::FETCH_ASSOC)) {
echo "id: {$msg['id']}\n";
echo "data: <article>\n";
echo "data: <img src='{$UI[profile_pic]}' alt='{$UI[full_name]}' />\n";
echo "data: <section class='msgCntnt'>\n";
echo "data: <p class='timeAgo'>". Agotime($msg[sent]) ."</p>\n";
echo "data: <a href='/profile?u={$UI[username]}'>{$UI['full_name']}</a><br />\n";
echo "data: <h4>@{$msg['msg_from']}</h4>\n";
echo "data: <p>{$msg['message']}</p>\n";
echo "data: </section>\n";
echo "data: </article>\n\n";
}
ob_flush();
flush();
sleep(1);
}
}
getMessages();
?>