javascript - js能否在一个http长请求中多次进行数据交互?
大家讲道理
大家讲道理 2017-04-10 16:45:01
0
6
309
  1. 描述你的问题
    能否在请求服务器端执行一个耗时较长的任务时,过程中会返回进度,利用http长连接

  2. 服务器端环境为 lighttpd + CGI(linux c实现,非fastcgi)

  3. 例如这里的代码,http发起一次请求后,需要等待服务器端CGI进程执行结束后才能得到返回值,而CGI在执行期间会不停打印进度。导致只有执行到100%的时候才一次性返回所有值"1%2%3%...100%",而不是依次返回更新进度。

    $.post(url, data, function(progress) {
        update(progress);
    });
大家讲道理
大家讲道理

光阴似箭催人老,日月如移越少年。

reply all(6)
大家讲道理

前面几位大神说的都对,但是题主的要求Ajax是无法实现的。

  • Ajax都是一次请求结束了,调用一个回调来通知

  • 实时的获取数据的动态变化做不到

感谢 @白一梓 让我知道了XMLHttpRequest level 2 API(对以上言辞做修改),于是有了第4种方法

提供几种方法:

  1. 用EventSource(这个个个浏览器的支持不一,IE就不支持)看这两个就能看懂MDN EventSource,这里面有个例子

  2. WebSocket

  3. 内嵌一个隐藏的iframe,iframe的src属性指向你的长耗时任务的URL,然后写一个Timer不停的去刷新iframe中的内容,根据内容字符串的最后一个百分号的值,获得进度。

  4. 使用ajax XMLHttpRequest level 2 API

PS: 另外CGI的机制不太清楚,是CGI执行完毕,一次性的获得stdout的内容,一次性传回,还是一边执行CGI一边传输stdout的输出,如果是前置,那就没办法了

这里把方法4做个例子:
服务器端用nodejs写一个模拟(Node.js >= v4.x)

'use strict';

const http = require('http');

const server = http.createServer();
server.on('request', function(req, res) {
    console.log('HTTP', req.method, req.url);
    let n = 0;
    res.writeHead(200, {
        'Content-Type': 'text/plain',
        'Connection': 'keep-alive',
        'Access-Control-Allow-Origin': '*',
        'Content-Length': 100
    });

    const inter = setInterval(function() {
        res.write('.');
        n++;
        if (n >= 100) {
            clearInterval(inter);
            res.end();
        }
    }, 50);

    res.on('error', function(err) {
        console.log(err);
    });

    res.on('close', function() {
        console.log('Connection close');
    })
});

server.listen(8000);

网页如下:




    
    

Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!