how to download file using api angular

Question

I have an API that downloads a file, I have a button on the button I have a click that sends a request to the API for download a file, but it doesn't work request sending successfully but the file is not downloaded, but when I'm adding the URL into the browser the file is successfully downloaded

HTML

<button (click)="exportFile()">Download</button>

TS

  exportFile(): void{
this.companiesService.export().subscribe((res) => {
  console.log(res);
});
}

Service

  export(){
    const headers = this.httpOptions.headers.set('Authorization', `Bearer ${this.cookieService.get('access-token')}`);
    return this.http.get(`${this.API_URL}/company/export/`,{headers});
  }

https://stackoverflow.com/a/43133108/5319180 I think this will solve your issue — D.B.K, Jan 27 '22 at 07:03
Does this answer your question? [How to handle file downloads with JWT based authentication?](https://stackoverflow.com/questions/29452031/how-to-handle-file-downloads-with-jwt-based-authentication) — Shashank Vivek, Jan 27 '22 at 07:04

score 1 · Accepted Answer · answered Jan 27 '22 at 07:19

You need to process the returned blob and save it as a file. Just returning it is not enough. Perhaps this demo can give you more insight how to improve your service. https://stackblitz.com/edit/angular-file-download-progress-qsqsnf?file=src%2Fapp%2Fdownload.ts

how to download file using api angular

1 Answers1