• 用大白话揭开Ajax长轮询(long polling)的神秘面纱


    在看这篇Ajax长轮询之前可以先看看Ajax轮询技术(没有长),有助于理解:

    Ajax长轮询属于Ajax轮询的升级版,在客户端和服务端都进行了一些改造,使得消耗更低,速度更快。

    "不间断的通过Ajax查询服务端"。

    来,小二,先上代码~:

    Reception.html //客户端

    <html>
    
    <head>
    
        <title></title>
    
        <script src="http://lib.sinaapp.com/js/jquery/1.9.1/jquery-1.9.1.min.js"></script>
    
    </head>
    
    <body>
    
    </body>
    
    <script type="text/javascript">
    
        //前端Ajax持续调用服务端,称为Ajax轮询技术
    
        var getting = {
    
            url:'server.php',
    
            dataType:'json',
    
            success:function(res) {
    
             console.log(res);
    
             $.ajax(getting); //关键在这里,回调函数内再次请求Ajax
    
    }
    
    };
    
    $.ajax(getting);
    
    </script>
    
    </html>
    

    server.php: //服务端

    <?php
    
    $pdo = new PDO('mysql:dbname=test;host=127.0.0.1','root','root');
    
    $resource = $pdo->query('select * from t1');
    
    $result = $resource->fetchall();
    
    while (true) {
    
        if ($result) {
    
            //exits data
    
            print_r(json_encode(array('success'=>'存在数据,返回')));
    
            exit(); //输出数据,退出。然后客户端不间断继续发起请求
    
        }
    
        //数据不存在,继续循环。
    
    }
    
    ?>
    

    看出了玄机了嘛?长轮询的精髓就在于Ajax的回调函数,继续再次调用Ajax请求(不间断的原理就在这里,成功返回后立即再次调用):

    $.ajax(getting);

    下面是是Ajax 长轮询的图解:

    首先请忽略绿色字体的使用限制,然后哪位朋友有可以推荐的画图工具可以推荐给我,我现在用的是忆图图示。

    图中有两次请求(本文中的请求默认均为Ajax),第一次很快返回了结果,然后不间断的立即发送第二次请求,但是第二次请求没有获得数据,所以请求迟迟没有返回(被挂在服务器了,但只要有数据就会再次返回),如果第二次的请求返回数据后,第三次请求旋即会立刻发出,这种技术就称为Ajax 长轮询。

    用伪代码来表示就是这样:

    <?php
    
    //客户端通过Ajax发起请求
    
    if ('客户端发送请求' && '服务端有数据可以返回') {
    
        echo '返回数据给客户端';
    
        echo '客户端通过Ajax继续发起请求,然后继续if判断';
    
    }else{
    
        echo'没有数据可以返回,再次执行一次if判断';
    
    }
    
    ?>
    

    最关键的地方在于前一次请求结束后,第二次请求立即不间断的发起,这个就叫做Ajax长轮询

  • 相关阅读:
    结对-五子棋游戏-开发过程
    团队-象棋游戏-设计文档
    课后作业-阅读任务-阅读提问-4
    团队-及格成绩查询系统-项目总结
    11.29-构建之法:现代软件工程-阅读笔记
    软件工程课程总结
    团队-及格成绩查询系统-最终程序
    团队-象棋游戏-团队一阶段互评
    课后作业-阅读任务-阅读提问-3
    课后作业-阅读任务-阅读笔记-3
  • 原文地址:https://www.cnblogs.com/chunguang/p/5538391.html
走看看 - 开发者的网上家园