How to show real download progress for a json data?

Asked Aug 26 '15 at 07:25

Active Aug 26 '15 at 07:33

Viewed 1,818 times

I was trying to show some real time progress bar for a large json data, while it gets fully downloaded.

Is it possible?

I tried using XMLHttpRequest.

$.ajax({
    xhr: function () {
        var xhr = new window.XMLHttpRequest();
        xhr.addEventListener("progress", function (evt) {
            if (evt.lengthComputable) {
                var percentComplete = evt.loaded / evt.total;
                console.log(percentComplete);
            }
        }, false);
        return xhr;
    },
    type: 'GET',
    url: 'url',
    data: {},
    success: function (data) {
        console.log("success")
    }
});

Here, evt.lengthComputable is coming as false. Is there any way to show real time progress bar for json data?

edited Aug 26 '15 at 07:33

Andreas

21,535
7
47
56

asked Aug 26 '15 at 07:25

Arun Prakash

2

An excellent answer was provided here: http://stackoverflow.com/a/22504560/101662 – Oliver Aug 26 '15 at 07:40
3

I think `lengthComputable` is empty because browser does not know total size of your data. Try adding a `Content-Length` header? – Leo Nyx Aug 26 '15 at 07:40
1

@LeoNyx Is it possible if Content-Length header is available? – Arun Prakash Aug 26 '15 at 09:50
Do you have any url with content length header? – Arun Prakash Aug 26 '15 at 11:10
Pretty much any static file on the internet is served with `Content-Length`. Your local development server will surely do, too. – Leo Nyx Aug 26 '15 at 12:43

How to show real download progress for a json data?

0 Answers0