angular: HttpClient request, report progress not working in production

Affected Package

The issue is in the http client (@angular/common/http) request report progress feature

Description

In my Angular app, I uploads files to a Node.js web service.

So I am using the HttpClient request method with reportProgress option on. When I run the app in dev mode (ng build), reportProgress works fine, but when run ng build --prod reportProgress stops working.

Here is a sample from the angular service that uploads files

const formData: FormData = new FormData();
formData.append('file', file, file.name);
const req = new HttpRequest('POST', url, formData, { reportProgress: true });
const progress = new Subject<number>();
const sub = this.http.request<any>(req).subscribe(
        event => {
          if (event.type === HttpEventType.UploadProgress) {
            const percentDone = Math.round(100 * event.loaded / event.total);
            progress.next(percentDone);
          } else if (event instanceof HttpResponse) {
            progress.complete();
            const datafiles = event.body.map(item => new Datafile(item));
            callback(datafiles);
          }
        },
        err => errCallback(err)
      );

About this issue

  • Original URL
  • State: closed
  • Created 5 years ago
  • Reactions: 1
  • Comments: 15 (3 by maintainers)

Most upvoted comments

check this out https://angular.io/guide/service-worker-devops search for 'ngsw-bypass ’ in the page, it will lead you to the paragraph that might describe your problem

gProDev Try seeing if service workers are your problem, you can delete ngsw.json and ngsw-worker.js from your production build and see if you are able to restore progress events.

Please provide a minimal reproduction by a newly generated Angular CLI project, you can use Postman echo API as backend.

If you claim it to be an Angular issue, then backend implementation should not make a difference.

@mlc-mlapis In fact I have an express server under Node.js, I mean that report progress events dont fire in production build is the answer to the question you asked Your formulation stops working means what?

@mlc-mlapis I have an express server under Node.js I mean that report progress events dont fire in production build

Why a thumbs down, this issue is real