带有百分比的 JQuery Ajax 请求答案

【问题标题】：JQuery Ajax Request with Percentage带有百分比的 JQuery Ajax 请求
【发布时间】：2014-06-30 15:25:32
【问题描述】：

我需要获得 ajax 请求的完成百分比。

我尝试了以下方法：

$(document).ready(function() {
    $.ajax({
        xhr : function() {
            var xhr = new window.XMLHttpRequest();
            xhr.upload.addEventListener("progress", function(evt) {
                if (evt.lengthComputable) {
                    var percentComplete = (evt.loaded / evt.total) * 100;
                    //Do something with upload progress here
                }
            }, false);

            xhr.addEventListener("progress", function(evt) {
                if (evt.lengthComputable) {
                    var percentComplete = (evt.loaded / evt.total) * 100;
                    //Do something with download progress
                    console.log(percentComplete);       
                }
            }, false);

            return xhr;
        },
        url : my_path
    }).done(function(data) {

        console.log(data);
    });
});

问题是我如何检查上面的代码是否工作。我总是在萤火虫控制台中得到100，我怀疑控制台中应该有多个%条目而不是100。

my_path 是一个从 MySQL 数据库返回记录的 PHP 页面。有什么方法可以减慢进程/页面渲染以检查功能？

【问题讨论】：

stackoverflow.com/questions/16690740/… 的可能重复项
@Manibharathi 我已经实现了该功能，需要通过减慢页面渲染或数据库操作来检查 % 功能？
你在本地系统中使用过吗？
什么的百分比？在纯理论层面上考虑它。如果尚未完成接收请求，浏览器应该如何知道请求的大小？如果您让服务器通过 Content-Length 标头宣布大小，那是一回事，但在您流回结果的情况下（我相信这是 php 通常所做的），这是不可能的。
@GeorgeMauer - 上传时，浏览器知道文件大小。下载时，必须在Header信息中设置，这在PHP中是不可能的（见我的回答，下面）。

标签： javascript php jquery mysql ajax

【解决方案1】：

使用 DB 读取的问题是首先需要知道大小，所以你真的需要一个文件来测试它。

对于下载（客户端从服务器下载），你需要引入延迟，否则你唯一的办法就是下载一个巨大的文件。

试试this script，它设置了正确的内容长度标头，一次只输出 50 个字节，延迟 1 秒（你可以用一个相对较小的文件来测试它，woot）。

至于上传（发布到服务器），在这方面你唯一的选择是把它做成一个大文件，完成后丢弃。

【讨论】：