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

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

用户端(可直接给客户发送消息)
客服端(点击用户名.即可给该用户回复消息)
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;
?>

转载于:https://www.cnblogs.com/killers888/p/5045955.html

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

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

    用SignalR 2.0开发客服系统[系列3:实现点对点通讯] 原文:用SignalR 2.0开发客服系统[系列3:实现点对点通讯] 前言 目录: 用SignalR 2.0开发客服系统[系列1:实现群 ...

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

    原文:用SignalR 2.0开发客服系统[系列5:使用SignalR的中文简体语言包和其他技术点] 前言 交流群:195866844 目录: 用SignalR 2.0开发客服系统[系列1:实现群发通 ...

  3. ChatGPT客服系统产品-利用chatgpt训练企业知识开发个性化客服系统

    打造最前沿的AI智能客服系统,基于自有数据语料,充分运用ChatGPT的大模型自然语言生成能力,定制化客服系统为企业提供自主性的客服服务能力. ChatGPT如何革新智能客服? 根据当前ChatGPT ...

  4. 怎么联系vue客服_Vue在线客服系统【开源项目】

    1. 项目介绍 一个基于Vue2.0的在线客服系统. 技术栈包含:Vue.VueX.Vue Router.Element UI. 2. 功能介绍 项目包含了2个模块:客服端和访客端. 2.1 客服端功 ...

  5. 做好开源客服系统,春松客服入驻 Rainbond 开源应用商店 | Chatopera

    春松客服是通过开源,以新的模式为企业交付智能客服系统: OpenSource + Cloud.OpenSource 让更多人有开发客服系统的技能,Cloud 让测试.上线.成本都比现在的模式容易.甚至 ...

  6. 一周开发一个轻量级客服系统(代码开源)

    文章目录 前言 一.聊天系统为什么使用短连接? 二.技术方案 后端技术方案: 前端技术方案 原生端 三.代码详细设计 1.数据库设计 2.后端程序 3.前端程序 四.效果展示 五.源码-GitHub ...

  7. 某电商平台开发记要——客服系统

    假如网站需要提供客服功能,如果只是简单的聊天咨询可以考虑营销QQ.百度商桥等(目前大部分网站采用此方式,包括一些知名行业电商):如果需要更精细化的管理,比如客服人员安排.各项数据统计汇总,那么需要对接 ...

  8. 使用 WPF+ ASP.NET MVC 开发 在线客服系统 (一)

    近段时间利用业余时间开发了一套在线客服系统,期间遇到过大大小小不少问题,好在都一一解决,最终效果也还可以,打算写一个系列的文章把开发过程详细的记录下来. 希望能够和更多的开发人员互相交流学习,也希望有 ...

  9. 智能客服系统开发(技术方案)

    一个智能客服系统,负责全部的开发任务:主要包括前端页面开发,后台逻辑设计,中间客服与用户之间的对话流设计(算法部分),以及系统部署. 前端页面采用vue框架(最近比较火的一个框架,vuejs比较贴合p ...

最新文章

  1. Directx11教程(61) tessellation学习(3)
  2. WSUS Troubleshooting guide
  3. Spring Boot Maven插件
  4. css禁止鼠标双击选中文字
  5. Windows 配置 Github 的 SSH-key
  6. 如何查看 SAP Fiori Elements List Report Table 都支持哪些设置
  7. 数据仓库中两种数据模型的分析比较
  8. AI应用开发基础傻瓜书系列2-神经网络中反向传播与梯度下降的基本概念
  9. html控制按钮里面的文字,有谁可以告诉我web网页制作中通过三个按钮控制页面上的一段文字放? 爱问知识人...
  10. Python 动态获取对象的属性和方法(内含inspect)
  11. 【白皮书分享】工业互联网平台新模式新业态白皮书.pdf
  12. 第一批“绿牌”汽车终于要换电池了,看到价格后,你还要买吗?
  13. LCA 算法(一)ST表
  14. c#结构体与类的区别
  15. Linux红帽认证管理员(RHCAS)考试笔记
  16. springboot session超时时间
  17. it项目管理之项目进度报告
  18. 智能眼镜现在是什么水平?
  19. 【Linux云计算架构:第二阶段-Linux必会的20多种服务】第22章——-源码编译安装LAMP
  20. ubuntu8.04安装配置,现有问题集合,及解决方法

热门文章

  1. python2和python3解释器的区别
  2. Spring中AOP切面编程学习笔记
  3. OI回忆录——一个过气OIer的制杖历程
  4. (HDU)1019 --Least Common Multiple(最小公倍数)
  5. 查看WEB服务器的连接数
  6. a标签的href与onclick中使用js的区别
  7. 从硬核科幻小说《三体》中看嵌入式
  8. POJ 1422 Air Raid
  9. 谷歌(Google)是怎样对待离世的Google员工的?
  10. jQuery选择元素