javascript - 在完成加载之前获取 AJAX 响应的大小

Question

我使用 jQuery 通过 AJAX 从服务器加载数据，这是一个相当正常的用例。诀窍是我想在请求完成之前从请求中获取预期的内容长度；我希望能够在加载数据时显示进度条。

有什么办法可以做到这一点吗？我必须想象有。谢谢!

更新:服务器必须做相当多的工作来生成响应，所以我不想用两个请求来击中它，它会达不到目的。

Answer 1

您可以在ajax调用中使用xhr事件，然后将progress事件挂接到该事件，并检查事件。 lengthComputable= true，那么你就会获得值(value)，否则你不会获得值(value)。您可以查看以下代码。

$.ajax({
    type: 'POST',
    dataType: 'json',
    url: URL,
    cache: false,
    error: function (xhr, ajaxOptions, thrownError) {
        alert(xhr.responseText);
        alert(thrownError);
    },
    xhr: function () {
        var xhr = new window.XMLHttpRequest();
        //Download progress
        xhr.addEventListener("progress", function (evt) {
            console.log(evt.lengthComputable);
            if (evt.lengthComputable) {
                var percentComplete = evt.loaded / evt.total;
                console.log(percentComplete );
            }
        }, false);
        return xhr;
    },
    beforeSend: function () {
      // before send
    },
    complete: function () {
       // complete.
    },
    success: function (json) {
       // success;
    }
});