PHP利用反向Ajax技术实现在线客服系统

本文讲述了一个PHP利用反向Ajax技术实现在线客服系统的实例。分享给大家参考，如下：

反向Ajax技术，又称服务器推送技术、服务器推送等等。一般用于“在线客服”、“消息推送”、“即时通讯”等功能。比如新浪微博的私信功能，就是客户端不断请求服务器，创建连接，检查服务器是否返回信息。建立连接会浪费服务器资源。下面，我将根据客户端创建的不同连接，介绍三种实现反向Ajax的思路。

三种思维方式：

1.以固定的时间间隔创建连接

这种方式是在固定时间连续请求服务器。当创建第一个连接时，无论是否有数据返回，该连接都将失败，然后定期发出第二个请求，连续重复该操作。这种方法浪费的资源最多。

2.长连接模式

这样，总是只创建一个连接，但这个连接没有断开，称为长期连接，从而不断获取服务器推送的数据。这种方法只创建一个连接，比第一种方法好。

3.长连接和长轮询模式

这种方式总是会产生一种联系，这种联系也是一种长期的联系。但是，如果获得了服务器推送的数据，则会断开该连接，然后定期创建第二个连接。这是最好的方式，新浪微博的私信功能就是用的。

在线客户服务系统

实施思路：

(1)向客户提问，将问题存储在数据库中，并在客服人员的聊天窗口中显示咨询内容；(2)客服人员看到聊天窗口后，选择咨询用户进行回复，然后在客服人员窗口显示回复内容。

实现方法：

本系统按照上述思路通过第二、三种方式实现，咨询客户通过第三种方式实现，客服人员通过第二种方式实现。

数据库信息：

Mid:主键，pos表示发送方，rec表示接收方，isread表示是否已阅读，content表示咨询/回复内容。

项目结构图：

客户服务界面：

这里使用长连接。页面中有一个div，用来显示聊天信息，还有一个隐藏的iframe标签。这个iframe实现了反向ajax模型，用于发送长期连接。当服务器有数据时，服务器会调用comet()方法，显示咨询内容，choose()方法是选择咨询者，resp()方法是回复。这里，一个Ajax请求将被发送到16-kefu-sendmsg.php页面，一个回复消息将被插入到数据库中。

？phpsetbookie(' username '，' admin ')；DOCTYPE htmlhtmlhead元字符集='utf-8 '元http-equiv=' X-UA-兼容'内容=' IE=边'标题客服功能——客服人员端/title link rel='样式表href='脚本var xhr=new XMLHttpRequest()；//服务器调用函数函数comet(JSON){ var content=' p style=' text-align : left ' span onclick=' choose(\ ' ' JSON。位置' \ ')；'json.pos '/span说：' JSON。内容'/p '；var old=文档。getelementbyid(' ChatArea ').innerHTMLdocument。getelementbyid(' ChatArea ').innerHTML=旧内容；} //咨询人选择函数函数选择(pos){文档。getelementbyid(“邮递员”).innerHTML=pos} //客服人员回复函数函数resp(){ var resp content=document。getelementbyid(' resp content ').价值；var pos=文档。getelementbyid(“邮递员”).innerhtml if(resp content==' ' | | pos==' '){ alert('请重新选择回复人或填写回复内容');返回；} //ajax提交请求xhr.open('POST '，' 16-福柯-sendmsg.php '，true)；xhr。setrequestheader(' Content-Type '，' application/x-www-form-URL编码')；xhr。onreadystatechange=function(){ if(this。readystate==4 this。status==200){ if(this。responsetext==' ok '){//回复成功，把回复信息显示到聊天界面中var content=' p style=' text-align : right '你回复pos ':' resp content/p '；var old=文档。getelementbyid(' ChatArea ').innerHTMLdocument。getelementbyid(' ChatArea ').innerHTML=旧内容；文件。getelementbyid(' resp content ').值=' ';//给回复内容重新置空} } } var send data=' rec=' pos ' content=' resp content；xhr.send(发送数据);}/脚本样式# ChatArea { width :500 px高度：400 pxborder:1px纯黑；飞越：卷轴；}/style/head dy h1客服功能——客服人员端/h1 h2原理：iframe长连接/H2 div id=' ChatArea '/div iframe width=' 0 ' height=' 0 '框架边框=' 0 ' name=' frame ' src=' http 3360 ./16-福柯iframe。PHP/咨询人：span id=' postman '/span/p ptextarea id=' resp content '/textarea/p pinput type=' button ' value='回复onclick=' resp()；//p/body/html发送咨询/回复消息(16-kefu-sendmsg.php)

主要是接受信息，把数据写入到数据库中

？php/** *客服回复咨询人，咨询人咨询客服* @ author webbc */header(' Content-type : text/html；charset=utf-8 ')；要求('。/conn . PHP ')；$ rec=$ _ POST[' rec ']；//咨询人变为接收者$ pos=$ _ COOKIE[' username ']；//客服人员变为发送者$ resp content=$ _ POST[' content ']；//客服人员的回复内容$sql='插入消息(位置、记录、内容)值(' $pos '、' $rec '、' $ resp content ')'；echo mysql_query($sql)？ok': '失败；客户人请求咨询信息(16-kefu-iframe.php)

主要功能是保持连接永不断开，然后不断的从数据库读取一条未读的咨询消息，如果有消息，先设置该消息为已读，返回射流研究…脚本，影响内联框架的父窗体

？php/** *通过内联框架来实现反向Ajax * @ author webbc */header(' Content-type : text/html；charset=utf-8 ')；set _ time _ limit(0)；//设置页面永久执行//ob _ start()；//打开输出缓存过了，就不需要使用此函数了//由于浏览器是根据内容大小才先显示，可以先显示4000个空白字符串让浏览器可以继续显示echo str_repeat('，4000)，' br/'；ob _ flush()；flush()；while(true){ //从数据库读取一条未读的咨询消息要求('。/conn . PHP ')；$sql='从味精中选择*其中rec='admin '和isread=0限制0,1 ';$ result=MySQL _ query($ SQL)；$ msg=MySQL _ fetch _ assoc($ result)；//如果有消息if(！空($msg)){ //设置该消息为已读$sql='update msg set isread=1，其中mid=' .$ msg[' mid ']；MySQL _ query($ SQL)；$ JSON=JSON _ encode($ msg)；//把数组转换为数据数据//返回射流研究…脚本，影响内联框架的父窗体回显"脚本";回声"家长。窗户。comet('，$json，')；”；echo '/script '；ob _ flush()；//strong制让服务器端编程语言(专业超文本预处理器的缩写)返回给Apache flush()；//strong制让网服务器返回给浏览器}睡眠(1);//隔1s循环查一次}?咨询人员界面(16-福柯-用户。php):

此处采用长连接长轮询的方式。当页面加载就发出一条创建交互式、快速动态网页应用的网页开发技术请求，如果该请求有数据返回，则显示到聊天窗口中，延时1s后重新发送请求，如果点击咨询，就发出创建交互式、快速动态网页应用的网页开发技术请求将咨询内容写入数据库中。

？PHP setcookie('用户名'、'用户。兰特(10000,99999));DOCTYPE htmlhtmlhead元字符集='utf-8 '元http-equiv=' X-UA-兼容'内容=' IE=边'标题客服功能——客服人员端/title link rel='样式表href='脚本src=' http :http://libs。百度。com/jquery/1。7 .2/jquery。量滴js/咨询方法函数ask(){ var AskContent=$(' # AskContent ').val()；if(askContent==''){ alert('请输入咨询内容');返回；} $.帖子('。/16-福柯-sendmsg.php '，{rec:'admin '，content:askContent}，函数(RES){ if(RES==' ok '){ $(' p style=' text-align : right ')你对客服说：' askContent '/p ').appendTo($(' # ChatArea '))；$('#askContent ').val(" ")；} });}/脚本样式# ChatArea { width :500 px高度：400 pxborder:1px纯黑；飞越：卷轴；}/style/head dy h1客服功能——用户端/h1 h2原理：ajax长连接长轮询/H2 div id=' ChatArea '/div ptextArea id=' AskContent '/文本区域/p pinput type=' button ' value='咨询onclick=' ask()；'//p/bodyscript //长连接长轮询定义变量设置={ URL : ' 16-福柯-ajax.php '，dataType:'json '，success : function(RES){ $(' p style=' text-align : left '客服对你说：' res.content '/p ').appendTo($(' # ChatArea '))；var func=function(){$ .ajax(设置)};window.setTimeout(func，1000)；//延时1s后重新发送连接} } $.ajax(设置);/script/html咨询人请求回复信息界面(16-福柯-ajax.php):

通过创建交互式、快速动态网页应用的网页开发技术长轮询实现反向Ajax。请求数据，获取数据后，将数据置为已读，然后返回，结束本次连接。

？php/** *通过创建交互式、快速动态网页应用的网页开发技术长轮询实现反向Ajax * @ author webbc */set _ time _ limit(0)；//不设置请求超时时间要求('。/conn . PHP ')；$ rec=$ _ COOKIE[' username ']；$sql='从味精中选择*其中rec='$rec '和isread=0限制0,1 ';while(true){ $ result=MySQL _ query($ SQL)；$ msg=MySQL _ fetch _ assoc($ result)；//如果有客服人员的回复信息if(！空($msg)){ //把该信息置为已读$sql='update msg set isread=1，其中mid=' .$ msg[' mid ']；MySQL _ query($ SQL)；echo JSON _ encode($ msg)；//返回数据数据exit()；//如果此次连接获取数据，就结束本次连接}睡眠(1);//隔一秒循环一次}?数据库连接文件(conn.php):

？PHP $ conn=MySQL _ connect(' localhost '，' root '，' 1234 ')；mysql_query('使用测试；');MySQL _ query(' set name utf8 ')；运行结果图：

更多关于服务器端编程语言(专业超文本预处理器的缩写)相关内容可查看本站专题： 《PHP+ajax技巧与应用小结》 、 《PHP网络编程技巧总结》 、 《PHP基本语法入门教程》 、 《php面向对象程序设计入门教程》 、 《php字符串(string)用法总结》 、 《php+mysql数据库操作入门教程》 及《php常见数据库操作技巧汇总》

希望本文对PHP编程有所帮助。