php开发客服系统(持久连接+轮询+反向ajax)

欢迎在php严程序 - php教程学习AJAX教程, 本节课讲解：php开发客服系统(持久连接+轮询+反向ajax)

php开发客服系统(下载源码)

用户端(可直接给客户发送消息)
客服端(点击用户名.即可给该用户回复消息)

讲两种实现方式：
一：iframe + 服务器推技术comet(反向ajax,即服务器向浏览器推送数据)
二：ajax持久连接 + 长轮询

客服端采用第一种方式:iframe + 服务器推技术
思路：
1：新建comentbyiframe.php 该用文件使用while(true)一直连接到服务器不断开.
如果在while的过程中查到了新数据.使用ob_flush推给apache服务器.apache再用flush推给浏览器.
2：新建html页面,插入一个iframe. 该iframe的src为comentbyiframe.php。
并隐藏iframe。comentbyiframe.php获取的数据用js输出到父窗口中的某个函数.该函数把信息追加到指定的聊天窗口中
3：只要客户端收到用户发来的数据. 就显示为"xx对你说..". 客服端只要点击用户名。即可给该用户发送数据.

用户端采用第二种方式：ajax持久连接 + 长轮询
ajax持久连接：文档加载完毕后(或其他时机)，使用ajax请求一个php文件
被请求的php文件通过while(true)循环.迟迟不给apache返回数据的目的.
轮询指：请求服务器的时候.如果服务器没有数据.则一直等.当服务器有数据后.就返回给客户端.
这样请求、响应过后就完成了一次HTTP请求. 还没完.客户端收到数据后又到服务器要数据.这就是轮询
就好像一个乞丐一样. 不给他钱，他就一直跟着你要. 你给他钱以后.他还不满足，又跑来找你要.
实现思路：
进入用户端后.如果没有用户名.使用setcookie设置一个用户名.然后通过ajax持久连接. 不停向服务器索要数据(即客服发送给该用户的记录)

数据表设计：
create table liao(
id int auto_increment primary key,
rec varchar(10) not null default ‘‘ comment ‘接收者‘,
pos varchar(10) not null default ‘‘ comment ‘发送者‘,
content varchar(30) not null default ‘‘ comment ‘发送内容‘,
isread tinyint not null default 1 comment ‘0已读1未读‘
)engine myisam charset utf8;

客服端首页：index.php


1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

47

48

49

50

51

52

53

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

 <head>

  <title> new document </title>

  <meta http-equiv="content-type" content="text/html;charset=utf-8" />

  <script type="text/javascript" src="http://libs.baidu.com/jquery/1.8.2/jquery.min.js"></script>

  <script>

    // 将用户发来的数据写到聊天对话框中

    function write_msg(msg){

        msg = eval(‘(‘+msg+‘)‘);

        $(‘<p><a href="javascript:;" onclick="setRec(\‘‘+msg.pos+‘\‘);">‘+(msg.pos)+‘</a>对你说：<br />&nbsp;&nbsp;‘+(msg.content)+‘</p>‘).appendTo($(‘#msgzone‘));

    }

    // 添加回复人

    function setRec(pos){

        $(‘#rec‘).val(pos);

        $(‘#comment_btn‘).val(‘回复给：‘+pos);

    }

    // 回复

    function comment(){

        var rec = $(‘#rec‘).val();      // 回复给谁

        var cont = $(‘#cont‘).val();    // 回复内容

        if (rec ==‘‘){

            alert(‘请先选择回复对象‘);

            return;

        }

        if (cont==‘‘){

            alert(‘说点什么吧‘);

            return;        

        }

        

        $.post(‘comment.php‘,{rec:rec,cont:cont},function(msg){

            if (msg == ‘ok‘){

                $(‘<p>你对‘+rec+‘说：<br />‘+(cont)+‘</p>‘).appendTo($(‘#msgzone‘));

                $(‘#cont‘).val(‘‘);

            }

        });

    }

  </script>

  <style type="text/css">

      #msgzone {width:500px; height:300px; border:1px solid #ccc; padding:10px; overflow:scroll;}

  </style>

 </head>

 <body>

  <h1>客服系统 - 客服端</h1>

  <div id="msgzone"></div>

  <iframe src="byiframe.php" width="0" height="0" frameborder="0"></iframe>

  <textarea cols="50" rows="6" id="cont"></textarea>

  <input type="button" value="回复给：" id="comment_btn" onclick="comment();" />

  <input type="hidden" id="rec" value="" />

 </body>

</html>

服务器不断推送未读记录 byiframe.php


1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

<?php

/*

客服端

iframe + 服务器推技术 comet、反向ajax

*/

require ‘conn.php‘;

set_time_limit(0);

ob_start();

echo str_repeat(‘ ‘,4000);

//ob_flush();

ob_end_flush();

flush();

while (true){

    // 查询用户给客服端发送的数据

    $sql = ‘select * from liao where isread="1" and rec="admin" order by id desc limit 1‘;

    $rs = mysql_query($sql,$conn);

    $row = mysql_fetch_assoc($rs);

    if ($row){

        // 将消息设置为已读

        $setRead = ‘update liao set isread=0 where id=‘.$row[‘id‘];

        mysql_query($setRead,$conn);

        $json = json_encode($row);

        echo ‘<script>parent.write_msg(\‘‘.$json.‘\‘);</script>‘;

        ob_flush();     // 推给apache

        flush();        // 推给浏览器

    }

    sleep(1);

}

?>

客服给用户回复消息comment.php


1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

<?php

/*

给用户回复消息

*/

require ‘conn.php‘;

$rec = $_POST[‘rec‘];

$pos = ‘admin‘;

$cont = $_POST[‘cont‘];

$sql = "insert into liao (rec,pos,content) values (‘$rec‘,‘$pos‘,‘$cont‘)";

$rs = mysql_query($sql,$conn);

if ($rs){

    echo ‘ok‘;

}

?>

持久连接,如果有信息才把信息返回给客户端.之后连接断开 getuser.php


1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

<?php

/*

ajax调用本文件不断向服务器索要数据.如果成功后.break退出循环.

还没完,服务器返回以后.ajax再次调用继续索取

*/

if (!isset($_COOKIE[‘pos‘])){

    exit();

}

set_time_limit(0);

require ‘conn.php‘;

$pos = htmlspecialchars($_COOKIE[‘pos‘]);

while (true){

    $sql = ‘select id,content from liao where isread=1 and rec="‘.$pos.‘" order by id desc limit 1‘;

    $rs = mysql_query($sql,$conn);

    $find = mysql_fetch_assoc($rs);

    if ($find){

        $setRead = ‘update liao set isread=0 where id=‘.$find[‘id‘];

        mysql_query($setRead,$conn);

        echo json_encode($find);

        break;

    }

    

    sleep(1);

}

?>

不让断开,用户端不断调用getuser.php索要记录 byajax.php


1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

47

48

49

50

51

52

53

54

55

56

57

58

59

60

<?php

/*

客户端

*/

// 给该用户随机分配一个用户名

if (!isset($_COOKIE[‘pos‘])){

    setcookie(‘pos‘,‘user‘.mt_rand(1,100));

}

?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

 <head>

  <title> new document </title>

  <meta http-equiv="content-type" content="text/html;charset=utf-8" />

  <script type="text/javascript" src="http://libs.baidu.com/jquery/1.8.2/jquery.min.js"></script>

  <script>

    

    // 轮循索要数据

    $(function(){

        var setting = {

            url:‘getuser.php‘,

            dataType:‘json‘,

            success:function(msg){

                $(‘<p>客服对你说：<br />&nbsp;&nbsp;‘+msg.content+‘</p>‘).appendTo($(‘#msgzone‘));

                // 关键：服务器返回信息以后.再去服务器索要.即：轮询

                $.ajax(setting);

            }

        }

        $.ajax(setting);

    })

    // 给客服发送数据

    function say(){

        var cont = $(‘#cont‘);

        if (cont.val() == ‘‘){

            alert(‘说点什么吧‘);

            return;

        }

        

        $.post(‘toadmin.php‘,{content:cont.val()},function(msg){

            if (msg!=‘‘){

                $(‘<p>你对客服说：<br />‘+msg+‘</p>‘).appendTo($(‘#msgzone‘));

                cont.val(‘‘);

            }

        });

    }

  </script>

  <style type="text/css">

      #msgzone {width:500px; height:300px; border:1px solid #ccc; padding:10px; overflow:scroll;}

  </style>

 </head>

 <body>

  <h1>客服系统 - 用户端</h1>

  <div id="msgzone"></div>

  <textarea cols="50" rows="6" id="cont"></textarea>

  <input type="button" value="发送" onclick="say();" />

 </body>

</html>

用户向客服发送消息 toadmin.php


1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

<?php

/*

向客服发送消息

*/

require ‘conn.php‘;

if (!isset($_COOKIE[‘pos‘])){

    exit();

}

$pos = htmlspecialchars($_COOKIE[‘pos‘]);   // 发送者

$rec = ‘admin‘;         // 接收者

$cont = htmlspecialchars($_POST[‘content‘]); // 发送内容

$sql = "insert into liao (pos,rec,content) value (‘$pos‘,‘$rec‘,‘$cont‘)";

mysql_query($sql,$conn);

echo $cont;

?>
时间： 2024-10-30 10:28:01

php开发客服系统(持久连接+轮询+反向ajax)的相关文章

用SignalR 2.0开发客服系统[系列2:实现聊天室]

前言 上周发表了 用SignalR 2.0开发客服系统[系列1:实现群发通讯] 这篇文章,得到了很多帮助和鼓励,小弟在此真心的感谢大家的支持.. 这周继续系列2,实现聊天室的功能. 开发环境 开发工具:VS2013 旗舰版 数据库:未用 操作系统:WIN7旗舰版 正文开始 首先我们来看看最终效果: 正式开始: SignalR作为一个强大的集线器,已经在hub里面集成了Gorups,也就是分组管理,使用方法如下: //作用:将连接ID加入某个组 //Context.ConnectionId 连接I

用SignalR 2.0开发客服系统[系列3:实现点对点通讯]

原文:用SignalR 2.0开发客服系统[系列3:实现点对点通讯] 前言 目录: 用SignalR 2.0开发客服系统[系列1:实现群发通讯] 用SignalR 2.0开发客服系统[系列2:实现聊天室] 真的很感谢大家的支持,今天发表系列3,我们的正菜马上就要来了.. 开发环境 开发工具:VS2013 旗舰版 数据库:未用 操作系统:WIN7旗舰版 正文开始 首先我们来看看实现的效果: 所用到的方法和类(重要): 其实细心的朋友应该早就发现了,在上篇博客我们就已经用到了这个方法: //调用指定

用SignalR 2.0开发客服系统[系列5:使用SignalR的中文简体语言包和其他技术点]

前言 交流群:195866844 目录: 用SignalR 2.0开发客服系统[系列1:实现群发通讯] 用SignalR 2.0开发客服系统[系列2:实现聊天室] 用SignalR 2.0开发客服系统[系列3:实现点对点通讯] 用SignalR 2.0开发客服系统[系列4:负载均衡的情况下使用SignalR] 以上是系列目录,终于到了结束的时候了.... 为了这个系列,真的是绞尽脑汁,终于..决定在这里完结了.. 值得兴奋的是,在SignalR2.2的NuGet包中,终于出现了简体中文语言包.(

在线客服系统 开发实战系列（一：需求分析及技术方案初步选型）

在这个系列的文章里,我将尝试一步一步开发一套功能完备的在线客服系统,并最终将其开源在 Git 上,欢迎关注. 鉴于水平限制,难免有所疏漏,欢迎批评指正. 文章将分为几个部分 一.需求分析及技术方案初步选型 二.技术方案选型,验证 三.底层框架设计,开发 四.服务器设计开发 五.客户端设计开发 六.Web端设计开发 在这个系列的文章中,您将了解并学习到以下技术知识: MSMQ.YUI.WebSocket.WinForms 如果这些技术对您有用,还请您 推荐 一下本文章,谢谢! 首先我们大概看看什么

开源在线客服系统开发实战（一：初步需求分析与技术选型）

(已移除参考产品链接) 在这个系列的文章里,我将尝试一步一步开发一套功能完备的在线客服系统,并将其开源在 Git 上,欢迎关注. 目前进度:开发框架初步搭建,技术验证DEMO,Git 地址随后附上,敬请关注. 鉴于水平限制,难免有所疏漏,欢迎批评指正. 文章将分为几个部分 一.需求分析及技术方案初步选型 二.技术方案选型,验证 三.底层框架设计,开发 四.服务器设计开发 五.客户端设计开发 六.Web端设计开发 在这个系列的文章中,您将了解并学习到以下技术知识: MSMQ.YUI.WebSock

使用 WPF+ ASP.NET MVC 开发 在线客服系统 （一）

近段时间利用业余时间开发了一套在线客服系统,期间遇到过大大小小不少问题,好在都一一解决,最终效果也还可以,打算写一个系列的文章把开发过程详细的记录下来. 希望能够和更多的开发人员互相交流学习,也希望有有兴趣的小伙伴一起加入开发当中来,毕竟一个人的力量是有限的 :) 有兴趣的小伙伴请加Q:279060597 系列文章将分为几个部分 零.概述(本篇) 一.需求分析及技术方案初步选型 二.技术方案选型,验证 三.底层框架设计,开发 四.服务器设计开发 五.客户端设计开发 六.Web端设计开发 在这个系

某客服系统上传漏洞导致服务器被拿下（续）

      上次说到我们的服务器因为这个客服系统被拿下后,我们在服务器后台进行了木马查杀,结果杀出了不少木马,但经过筛选之后,真正能执行的只有2个,查看这两个木马的创建时间,一个是3天前,也就是白帽子第一次尝试跟我们联系的时间点,而另外一个创建时间居然是几年前,在百思不得其解的情况下我们向这位白帽子进行了确认,他说自己只传了一个木马,另外一个绝对不是他的,话说回来,我们的客服系统才上线了几个月,怎么会有几年前的马呢?说到这里,想必大家已经在质疑了,这会不会是这个客服系统自带的呢?为了证明这件事,

视频客服系统的实现

在开发视频通讯这一类系统的时候,往往需要有良好的编解码基础,同时也要求有扎实的网络编程功底,但要做一个稳定的.高性质的视频通讯系统,更需要算法. 因此,总的来说,视频系统整合程序设计中的大部分知识,可想而知,从设计到实现这一个系统,工作量是非常大的,往往付出了大的心机,但时间与专业的不足,可能会带来不怎么好的实现,甚至是付诸东流. 在这里,可以作为一个交流区,目前是实现了视频通讯的应用了,但在跨平台上,还不是非常的成熟,如android,ios等手机系统,有机会在这方面有兴趣的人可以下载我的de

Vue在线客服系统【开源项目】

1. 项目介绍 一个基于Vue2.0的在线客服系统. 技术栈包含:Vue.VueX.Vue Router.Element UI. 2. 功能介绍 项目包含了2个模块:客服端和访客端. 2.1 客服端功能 1)文本和表情混合内容的接收和发送. 2)图片.文件的接收和发送. 运行图 2.2 访客端功能 1)文本和表情混合内容的接收和发送. 2)图片.文件的接收和发送. 3)评分. 4)留言. 5)断开连接. 运行图 3. 消息的通信分层 在客服系统项目中对消息的处理采用了2种通信方式:socket和