CODEWITHSUNDEEP
angular5
Pranab V V
Pranab V V

Reputation: 1446

how to download a pdf file from an url in angular 5

I currently spend one day in this issue,still failed to download a file from an url in angular 5

leadGenSubmit() {

    return this.http.get('http://kmmc.in/wp-content/uploads/2014/01/lesson2.pdf',
    {responseType:ResponseContentType.Blob}).subscribe((data)=>{
        console.log(data);
        var blob = new Blob([data], {type: 'application/pdf'});
        console.log(blob);
        saveAs(blob, "testData.pdf");
    },
    err=>{
        console.log(err);
        }
    )
}

when I run above code it shows following error

ERROR TypeError: req.responseType.toLowerCase is not a function
    at Observable.eval [as _subscribe] (http.js:2187)
    at Observable._trySubscribe (Observable.js:172)

how can I solve this issue.Can any one post the correct code to download a pdf file from an url in angular 5?

Upvotes: 19

Views: 79214

Answers (3)

jpmottin
jpmottin

Reputation: 3027

Here is my simple solution to open a PDF based on an ID in Angular :

In my service, I created this method :

public findById(id?: string): Observable<Blob> {
  return this.httpClient.get(`${this.basePath}/document/${id}`, {responseType: 'blob'});
}

Then in my component, I can do use this method (behind a button or whatever):

showDocument(documentId: string): void {
  this.yourSuperService.findById(documentId)
    .subscribe((blob: Blob): void => {
      const file = new Blob([blob], {type: 'application/pdf'});
      const fileURL = URL.createObjectURL(file);
      window.open(fileURL, '_blank', 'width=1000, height=800');
    });
}

Upvotes: 10

Suren Konathala
Suren Konathala

Reputation: 3597

Try this

let headers = new HttpHeaders();
headers = headers.set('Accept', 'application/pdf');
return this.http.get(url, { headers: headers, responseType: 'blob' as 'json' });

References:

Upvotes: 5

ochs.tobi
ochs.tobi

Reputation: 3454

I think you should define header and responseType like this:

let headers = new HttpHeaders();
headers = headers.set('Accept', 'application/pdf');
return this.http.get(url, { headers: headers, responseType: 'blob' });

Upvotes: 35

Related Questions