AJAX PHP MySQL 聊天
Posted
技术标签:
【中文标题】AJAX PHP MySQL 聊天【英文标题】:AJAX PHP MySQL Chat 【发布时间】:2011-07-12 09:18:17 【问题描述】:我的聊天程序有一个罕见的问题,它往往会显示两次消息。该消息仅在数据库中显示一次,但就像我说的那样,它很少在客户端显示两次...
SELECT *
FROM `ims`
WHERE `to` = '$ACCOUNT_ID'
&& `sent_time` >= '$IM_SYSTEM_CHECK'
&& `sent_time` < '$CURRENT_TIME'
|| `from` = '$ACCOUNT_ID'
&& `sent_time` >= '$IM_SYSTEM_CHECK'
&& `sent_time` < '$CURRENT_TIME'
ORDER BY `sent_time` ASC
它的工作原理是,它加载大于或等于上次消息检查 ($IM_SYSTEM_CHECK) 的任何消息,但它们必须小于当前时间,即调用后的 ($IM_SYSTEM_CHECK)。我不明白这个问题是怎么存在的。
是的,这里有更多代码...
function UPDATE_SYSTEM()
UPDATE_SYSTEM_REQUEST = new XMLHttpRequest();
UPDATE_SYSTEM_REQUEST.onreadystatechange = function()
if(UPDATE_SYSTEM_REQUEST.readyState == 4)
if(UPDATE_SYSTEM_REQUEST.responseText == "BAD_KEY")
window.location = 'index.php';
else
SYSTEM_FULL = UPDATE_SYSTEM_REQUEST.responseText;
if(SYSTEM_FULL != "")
SYSTEM_IM = SYSTEM_FULL.split("¥");
for(IM_ROW in SYSTEM_IM)
IM_INFO = SYSTEM_IM[IM_ROW].split("€");
REMOVE_COOKIE("CLOSED_LIST",IM_INFO[0]);
if(IM_INFO[0] != undefined)
if(IM_TABS[IM_INFO[0]] == undefined)
IM_TABS[IM_INFO[0]] = 0;
if(IM_TABS[IM_INFO[0]] == 0)
IM_TABS[IM_INFO[0]] = 1;
IM_BAR++;
if(document.getElementById("IM_BAR_BOX").style.display == "none")
document.getElementById("IM_BAR_BOX").style.display = "block";
if(CURRENT_IM == 0 && IM_LOAD == 1)
im_display = "block";
CHANGE_CURRENT(IM_INFO[0]);
else
im_display = "none";
NIMD = document.createElement("div");
NIMD.id = "IM_"+IM_INFO[0];
NIMD.style.position = 'relative';
NIMD.style.cssFloat = 'left';
NIMD.style.margin = '3px 0px 0px 3px';
NIMD.style.width = '24px';
NIMD.style.height = '24px';
if(IM_INFO[1] == "graphics/mini_no_picture.png")
IM_PICTURE = "graphics/im_bar_no_picture.png";
else
IM_PICTURE = IM_INFO[1];
NIMD.innerhtml = '<div id="IM_INNER_'+IM_INFO[0]+'" style="display: '+im_display+'; position: absolute; top: -360px; left: -11px; width: 230px; height: 353px; background-image: url(\'graphics/im_box.png\');"><img style="position: absolute; top: 4px; left: 4px;" src="'+IM_INFO[1]+'"><div style="position: absolute; top: 2px; left: 47px; font-size: 13px; font-weight: bold; color: #FFFFFF;">'+IM_INFO[2]+'</div><img style="position: absolute; top: 4px; left: 202px; cursor: pointer;" src="graphics/minimize.png" onClick="document.getElementById(\'IM_INNER_'+IM_INFO[0]+'\').style.display=\'none\'; CHANGE_CURRENT(0);"><img style="position: absolute; top: 4px; left: 217px; cursor: pointer;" src="graphics/close.png" onClick="CLEAR_IM('+IM_INFO[0]+'); document.getElementById(\'IM_BAR_BOX\').removeChild(document.getElementById(\'IM_'+IM_INFO[0]+'\')); IM_TABS['+IM_INFO[0]+'] = 0; CHANGE_CURRENT(0); IM_BAR--; if(IM_BAR == 0) document.getElementById(\'IM_BAR_BOX\').style.display = \'none\'; "><img style="position: absolute; top: 326px; left: 212px; cursor: pointer;" src="graphics/im_send.png" onClick="IM_SEND('+IM_INFO[0]+',document.getElementById(\'IM_MESSAGE_'+IM_INFO[0]+'\').value);"><div id="IM_CONTENT_'+IM_INFO[0]+'" style="position: absolute; top: 48px; left: 4px; overflow-x: hidden; overflow-y: scroll; width: 218px; height: 270px; padding-bottom: 1px; padding-left: 3px; padding-top: 1px; word-wrap: break-word;"></div><input id="IM_MESSAGE_'+IM_INFO[0]+'" type="text" onkeyup="if(event.keyCode == 13 || event.which == 13) IM_SEND('+IM_INFO[0]+',document.getElementById(\'IM_MESSAGE_'+IM_INFO[0]+'\').value); " style="position: absolute; top: 325px; left: 5px; border: none; width: 202px; height: 16px; font-weight: bold; background-color: transparent; font-family: Arial; font-size: 14px; color: #000000;"></div><img style="cursor: pointer; width: 24px; height: 24px;" src="'+IM_PICTURE+'" onClick="if(document.getElementById(\'IM_INNER_'+IM_INFO[0]+'\').style.display == \'block\') document.getElementById(\'IM_INNER_'+IM_INFO[0]+'\').style.display=\'none\'; CHANGE_CURRENT(0); else document.getElementById(\'IM_INNER_'+IM_INFO[0]+'\').style.display=\'block\'; document.getElementById(\'IM_MESSAGE_'+IM_INFO[0]+'\').focus(); document.getElementById(\'IM_CONTENT_'+IM_INFO[0]+'\').scrollTop = document.getElementById(\'IM_CONTENT_'+IM_INFO[0]+'\').scrollHeight; if(CURRENT_IM != 0) document.getElementById(\'IM_INNER_\'+CURRENT_IM).style.display=\'none\'; CHANGE_CURRENT('+IM_INFO[0]+'); " title="'+IM_INFO[2]+'"><img id="IM_NEW_'+IM_INFO[0]+'" onClick="if(CURRENT_IM != 0) document.getElementById(\'IM_INNER_\'+CURRENT_IM).style.display=\'none\'; document.getElementById(\'IM_INNER_'+IM_INFO[0]+'\').style.display=\'block\'; document.getElementById(\'IM_MESSAGE_'+IM_INFO[0]+'\').focus(); document.getElementById(\'IM_CONTENT_'+IM_INFO[0]+'\').scrollTop = document.getElementById(\'IM_CONTENT_'+IM_INFO[0]+'\').scrollHeight; this.style.display = \'none\'; CHANGE_CURRENT('+IM_INFO[0]+');" title="'+IM_INFO[2]+'" style="display: none; position: absolute; top: 0px; left: 0px; z-index: 2; cursor: pointer;" src="graphics/new_message.png">';
document.getElementById("IM_BAR_BOX").appendChild(NIMD);
IM_TABS[IM_INFO[0]] = 1;
if(im_display == "block")
document.getElementById("IM_MESSAGE_"+IM_INFO[0]).focus();
if(document.getElementById("IM_CONTENT_"+IM_INFO[0]).innerHTML == "")
NIMM = document.createElement("div");
NIMM.innerHTML = '<div style="font-size: 12px; color: #FC7012; float: left; width: 138px; margin-bottom: -2px;">'+IM_INFO[3]+'</div><div style="font-size: 12px; color: #FC7012; float: left; width: 60px; text-align: right; margin-bottom: -2px;">'+IM_INFO[4]+'</div><div style="clear: left; font-size: 12px; color: #000000;">'+IM_INFO[5]+'</div>';
document.getElementById("IM_CONTENT_"+IM_INFO[0]).appendChild(NIMM);
else
ims = new Image();
ims.src = 'graphics/im_split.png';
ims.style.display = 'block';
ims.style.margin = '1px 0px 1px -3px';
ims.style.position = 'relative';
document.getElementById("IM_CONTENT_"+IM_INFO[0]).appendChild(ims);
NIMM = document.createElement("div");
NIMM.innerHTML = '<div style="font-size: 12px; color: #FC7012; float: left; width: 138px; margin-bottom: -2px;">'+IM_INFO[3]+'</div><div style="font-size: 12px; color: #FC7012; float: left; width: 60px; text-align: right; margin-bottom: -2px;">'+IM_INFO[4]+'</div><div style="clear: left; font-size: 12px; color: #000000;">'+IM_INFO[5]+'</div>';
document.getElementById("IM_CONTENT_"+IM_INFO[0]).appendChild(NIMM);
document.getElementById("IM_CONTENT_"+IM_INFO[0]).scrollTop = document.getElementById("IM_CONTENT_"+IM_INFO[0]).scrollHeight;
if(document.getElementById("IM_INNER_"+IM_INFO[0]).style.display == 'none' && IM_LOAD == 1 && IM_INFO[3] != "You")
document.getElementById("IM_NEW_"+IM_INFO[0]).style.display = 'block';
setTimeout("UPDATE_SYSTEM()",1000);
IM_LOAD = 1;
UPDATE_SYSTEM_REQUEST.open("GET","functions.php?CALL=UPDATE_SYSTEM&SECURITY="+SECURITY+"&LOAD="+IM_LOAD+"&PAGE_ID="+PAGE_ID,true);
UPDATE_SYSTEM_REQUEST.send(null);
【问题讨论】:
我们可能需要的不仅仅是查询来帮助您诊断问题。您能否提供有关 AJAX 调用和周围 PHP 脚本的更多信息? 另外,您可能不应该使用&&
和||
来表示AND
和OR
-- ||
在非 MySQL 的数据库中还有其他含义,您可能会发现最终你自己站在了错误的一边。
感谢查尔斯的提示,我是否使用 AND 和 OR 作为替代?
我注意到您的所有问题都是关于基础开发的。许多隐藏在繁琐代码中的问题可以通过像jquery这样的包装器来解决。
如果 php 代码不允许同一条消息被请求两次,那它怎么能像每几百条消息一样显示两次呢?
【参考方案1】:
发送一个 last_update_id(保存发送给客户端的最后一条消息 id)与您的查询(从 -1 开始)。并将其与响应一起发回
这将防止双打。
【讨论】:
谢谢。将其与时间系统一起使用将确保没有双打。 我也不认为SYSTEM_IM = SYSTEM_FULL.split("¥");
, IM_INFO = SYSTEM_IM[IM_ROW].split("€");
是个好主意,但我不确定你在做什么,所以只是盲目猜测以上是关于AJAX PHP MySQL 聊天的主要内容,如果未能解决你的问题,请参考以下文章
对 php 聊天应用程序过多的 mysql (ajax) 请求有啥负面影响?
Ajax PHP JavaScript MySQL实现简易的无刷新在线聊天室
仅使用 jQuery (Ajax) 和 PHP 从 MySQL 获取最新消息? (在线聊天APP)