PHP打造多人在线聊天室[二]

PHP打造多人在线聊天室[二]2013.04.14 15:16

第一篇帖子PHP打造多人在线聊天室[一]已经简单介绍了程序的基本功能。

但是还存在一个比较严重的Bug，在网络时延较大的情况下，会出现信息的重复显示。

问题为何出现？

在用户点击提交按钮的时候，会发送ajax请求，把用户输入的信息提交给服务器。

因为有另一个请求新信息的定时器开着，在网络时延较大的情况下，会出现当一条数据请求但还未输出在页面的时候，同样的数据会再次被请求，所以会出现信息的重复显示。

对这一问题进行了更正。

Index.js中

解决方案

定义两个请求标量：

varisNotGet=isNotSend=true;    //请求标量
//isNotGet：定义是否向服务器请求新的数据
//isNotSend：定义是否向服务器发送数据

向服务器请求新数据的定时器，必须在 isNotSend 和 isNotGet都为真的情况下才会发送请求。

定时器在发送一次请求后会先把 isNotGet 置为假，这样直到新数据请求成功后才会再次发送请求。

setInterval(function(){
//console.log(isNotGet+' '+isNotSend);
if(isNotGet&&isNotSend){
isNotGet=false;
varlastLi=oDivMsg.getElementsByTagName('li');
ajax({
url:'showMsg.php',
isAsyn:true,
onSuccess:function(data){
if(data){
eval('var json='+data);
fillData(json);
}
isNotGet=true; 
},
data:'&lastId='+lastLi.length
})
}
},refTime);

refTime为定义的定时器的间隔时间，默认为500毫秒，如果您所处网络时延较大，请在index.js顶部加大此值。

当用户点击发送按钮的时候，变量 isNotSend 会被修改为假值，这样一直到数据添加成功后才可以向服务器请求新的数据。

oBtns.onclick=function(){
varoTxta=document.getElementsByTagName('textarea')[0];
if(oTxta.value.length>0){
isNotSend=false;
ajax({
url:'addMsg.php',
isAsyn:true,
onSuccess:function(data){
if(data=='ok'){
oTxta.value='';
oTxta.focus();
}elseif(data=='no'){
alert('Fuck your mouth');
}else{
alert('Data Error！');  
}
isNotSend=true;
},
data:"name="+oBtn.value+"&content="+oTxta.value
});
}
}

由于网络时常出现不稳定现象或者程序未知的Bug，可能会出现信息发送失败，或者新信息无法接收等情况，请刷新一下页面即可。

并且程序加入的“黑名单 ”功能，进入黑名单的IP地址，将不能发言。

如要使用程序，请仔细阅读源码包中的readme.txt文件。

在线测试地址：http://yueqian.sinaapp.com/app/chatroom/

源码下载地址：http://pan.baidu.com/share/link?shareid=380157&uk=3877221858

小笙's Blog