“Save as” dialog box not appearing in firefox for downloading an image

See more:

Firefox

CSS3

HTML5

Angular6

I want to show "save as" dialog box for user to storing an image from Firefox but it is not appearing. But when I open it from google chrome, I can see that box appearing.

I did my reasearch for this but could not find anything about it.

Can anyone have an idea about this? Why it is not working in Firefox but only in Chrome?

Kindly help me or suggest me something so that it will work with Firefox.

Below is my code for downloading an image.

What I have tried:

downloadOriginalImage(url: string, viewImage: boolean) {
  const imageUrl = url.replace('/jpghigh', '');
  const headers = new Headers();
  headers.append('Accept', 'application/json');
  const options = new RequestOptions({ headers: headers, responseType: ResponseContentType.ArrayBuffer });
  return this.http.get(imageUrl, options)
    .toPromise()
    .then(
      response => {
        ProduktService.extractContent(response, viewImage);
      }).catch(
        error => ProduktService.handleError(error)
      );
}

private static extractContent(res: Response, viewImage: boolean) {
  const blob: Blob = res.blob();
  const mainHead = res.headers.get('content-disposition');
  const url = window.URL.createObjectURL(blob);
  const a = document.createElement('a');
  a.href = url;
  a.download = 'image.jpg';
  a.target = '_blank';
  a.click();
  a.remove();
}