Angular 12 Upload progress wrong (too fast) on Windows

Viewed 30

We are using a web frontend where we can upload big files (up to 2 GB) and we use this snippet:

    const headers = { /* private */ };
    const filestatus$ = this.http.put(url, file, {
        observe: 'events',
        reportProgress: true,
        headers,
    });

    const sub = filestatus$.subscribe((uploadProgress) => {
        switch (uploadProgress.type) {
            case HttpEventType.UploadProgress:
                const progress = 100 * (uploadProgress.loaded / uploadProgress.total!);
                console.log('progress', progress);
                break;
            case HttpEventType.Response:
                console.log('upload finished');
                sub.unsubscribe();
                break;
        }
    });

When I run this on my mac with Chrome, i get the logs with the progress and as soon as it reaches 100, I instantly get the "upload finished". (Long story short: Everything as expected) When I run it on Windows with Chrome I get a some of progress msgs, but only for a couple of seconds then it shows "progress 100" (which is not possible with my bandwith after that short duration) and a couple of minutes later (about the same time it takes on my mac), I get the "upload finished". If I open the dev tools, I can see the upload put request to be "pending" and when it completes I instantly get the finished. I guess that means, that the progress events are too early in Chrome on Windows.

How can I fix this?

(Of course this is usually shown as progress bar, but for debugging I used console.log)

0 Answers
Related