三种思路:
1、间隔固定时间创建连接
这种办法便是按照固定时间不断的去要求做事器,当创建第一个连接时,不管是否有数据返回,这次连接都会失落效,然后隔一段韶光发出第二个要求,不断重复此动作,此法最摧残浪费蹂躏资源。
2、长连接办法
这种办法始终只创建一个连接,而这个连接不断开,被称为永劫连接,以此不断获取做事器推送的数据,这种办法只创建一个连接,比第一种方法较好。
3、长连接+长轮询办法
这种办法始终创建连接,而这个连接也是永劫连接,但是如果得到做事器推送的数据,此连接断开,然后隔固定时间创建第二此连接,这种办法最好,新浪微博的私信功能用的便是这种方法。
在线客服系统
实现思路:
(1)咨询用户端发出问题,把问题存入数据库,把咨询内容显示到客服职员的谈天窗口中(2)客服职员看到谈天窗口后,选择咨询用户,进行回答,然后把回答内容显示到客服职员窗口中
实现方法:
此系统我采取上述思想中的第二种和第三种办法共同实现,咨询用户端采取第三种办法实现,客服职员端采取第二种办法实现。
数据库信息:
mid:主键,pos表示发送人,rec表示吸收人,isread表示是否已读,content表示咨询/回答内容。
项目构造图:
客服职员界面(16-kefu-amdin.php):
此处采取长连接。页面中紧张有一个div,用于显示谈天信息,还有一个隐蔽的iframe标签,这个iframe实现反向Ajax模型,用于发送永劫连接,当做事器有数据时,做事器将调用comet()方法,此方法显示咨询内容,choose()方法是选择咨询人,resp()是回答方法,在这里会向16-kefu-sendmsg.php页面发出ajax要求,向数据库插入一条回答信息,回答成功后并显示到谈天窗口中。
<?phpsetcookie(39;username','admin');?><!DOCTYPEhtml><html><head><metacharset="utf-8"><metahttp-equiv="X-UA-Compatible"content="IE=edge"><title>客服功能——客服职员端</title><linkrel="stylesheet"href=""><script>varxhr=newXMLHttpRequest();//做事器调用函数functioncomet(json){varcontent='<pstyle="text-align:left"><spanonclick="choose(\''+json.pos+'\');">'+json.pos+'</span>说:'+json.content+'</p>';varold=document.getElementById('chatArea').innerHTML;document.getElementById('chatArea').innerHTML=old+content;}//咨询人选择函数functionchoose(pos){document.getElementById('postman').innerHTML=pos;}//客服职员回答函数functionresp(){varrespContent=document.getElementById('respContent').value;varpos=document.getElementById('postman').innerHTML;if(respContent==''||pos==''){alert('请重新选择回答人或填写回答内容');return;}//ajax提交要求xhr.open('POST','16-kefu-sendmsg.php',true);xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');xhr.onreadystatechange=function(){if(this.readyState==4&&this.status==200){if(this.responseText=='ok'){//回答成功,把回答信息显示到谈天界面中varcontent='<pstyle="text-align:right">你回答'+pos+':'+respContent+'</p>';varold=document.getElementById('chatArea').innerHTML;document.getElementById('chatArea').innerHTML=old+content;document.getElementById('respContent').value='';//给回答内容重新置空}}}varsendData='rec='+pos+'&content='+respContent;xhr.send(sendData);}</script><style>#chatArea{width:500px;height:400px;border:1pxsolidblack;overflow:scroll;}</style></head><body><h1>客服功能——客服职员端</h1><h2>事理:iframe+长连接</h2><divid="chatArea"></div><iframewidth="0"height="0"frameborder="0"name="frame"src="./16-kefu-iframe.php"></iframe><p>咨询人:<spanid="postman"></span></p><p><textareaid="respContent"></textarea></p><p><inputtype="button"value="回答"onclick="resp();"/></p></body></html>
发送咨询/回答(16-kefu-sendmsg.php)
紧张是接管信息,把数据写入到数据库中
<?php/客服回答咨询人,咨询人咨询客服@authorwebbc/header('Content-type:text/html;charset=utf-8');require('./conn.php');$rec=$_POST['rec'];//咨询人变为吸收者$pos=$_COOKIE['username'];//客服职员变为发送者$respContent=$_POST['content'];//客服职员的回答内容$sql="insertintomsg(pos,rec,content)values('$pos','$rec','$respContent')";echomysql_query($sql)?'ok':'fail';?>
客户人要求咨询信息(16-kefu-iframe.php)
紧张功能是保持连接永不断开,然后不断的从数据库读取一条未读的咨询,如果有,先设置该为已读,返回js脚本,影响iframe的父窗体
<?php/通过iframe来实现反向Ajax@authorwebbc/header('Content-type:text/html;charset=utf-8');set_time_limit(0);//设置页面永久实行//ob_start();//打开输出缓存过了,就不须要利用此函数了//由于浏览器是根据内容大小才先显示,可以先显示4000个空缺字符串让浏览器可以连续显示echostr_repeat('',4000),"<br/>";ob_flush();flush();while(true){//从数据库读取一条未读的咨询require('./conn.php');$sql="selectfrommsgwhererec='admin'andisread=0limit0,1";$result=mysql_query($sql);$msg=mysql_fetch_assoc($result);//如果有if(!empty($msg)){//设置该为已读$sql='updatemsgsetisread=1wheremid='.$msg['mid'];mysql_query($sql);$json=json_encode($msg);//把数组转换为json数据//返回js脚本,影响iframe的父窗体echo'<script>';echo'parent.window.comet(',$json,');';echo'</script>';ob_flush();//逼迫让php返回给apacheflush();//逼迫让web做事器返回给浏览器}sleep(1);//隔1s循环查1次}?>
咨询职员界面(16-kefu-user.php):
此处采取长连接+长轮询的办法。当页面加载就发出一条ajax要求,如果该要求有数据返回,则显示到谈天窗口中,延时1s后重新发送要求,如果点击咨询,就发出ajax要求将咨询内容写入数据库中。
<?phpsetcookie('username','user'.rand(10000,99999));?><!DOCTYPEhtml><html><head><metacharset="utf-8"><metahttp-equiv="X-UA-Compatible"content="IE=edge"><title>客服功能——客服职员端</title><linkrel="stylesheet"href=""><scriptsrc="http://libs.baidu.com/jquery/1.7.2/jquery.min.js"></script><script>//咨询方法functionask(){varaskContent=$('#askContent').val();if(askContent==''){alert('请输入咨询内容');return;}$.post('./16-kefu-sendmsg.php',{rec:'admin',content:askContent},function(res){if(res=='ok'){$('<p style="text-align:right">你对客服说:'+askContent+'</p>').appendTo($('#chatArea'));$('#askContent').val('');}});}</script><style>#chatArea{width:500px;height:400px;border:1pxsolidblack;overflow:scroll;}</style></head><body><h1>客服功能——用户端</h1><h2>事理:ajax+长连接+长轮询</h2><divid="chatArea"></div><p><textareaid="askContent"></textarea></p><p><inputtype="button"value="咨询"onclick="ask();"/></p></body><script>//长连接+长轮询varsetting={url:'16-kefu-ajax.php',dataType:'json',success:function(res){$('<p style="text-align:left">客服对你说:'+res.content+'</p>').appendTo($('#chatArea'));varfunc=function(){$.ajax(setting)};window.setTimeout(func,1000);//延时1s后重新发送连接}}$.ajax(setting);</script></html>
咨询人要求回答信息界面(16-kefu-ajax.php):
通过ajax+长轮询实现反向Ajax。要求数据,获取数据后,将数据置为已读,然后返回,结束本次连接。
<?php/通过ajax+长轮询实现反向Ajax@authorwebbc/set_time_limit(0);//不设置要求超时时间require('./conn.php');$rec=$_COOKIE['username'];$sql="selectfrommsgwhererec='$rec'andisread=0limit0,1";while(true){$result=mysql_query($sql);$msg=mysql_fetch_assoc($result);//如果有客服职员的回答信息if(!empty($msg)){//把该信息置为已读$sql="updatemsgsetisread=1wheremid=".$msg['mid'];mysql_query($sql);echojson_encode($msg);//返回json数据exit();//如果这次连接获取数据,就结束本次连接}sleep(1);//隔一秒循环1次}?>
数据库连接文件(conn.php):
<?php$conn=mysql_connect('localhost','root','1234');mysql_query('usetest;');mysql_query('setnamesutf8');?>
1 ThinkPHP5底层源码剖析视频教程
2 PHP7入门到进阶_难得的好教程
3 2020-Laravel6实战视频教程
4 Restful Api实战演习训练
5 WebSocket网络实战2020最新版
视频教程不是给你收藏的,希望对提升你的学习技能有些许帮助吧!领取办法:点赞关注小编后私信【资料】获取资料领取办法!