Tel Map


Angular 5 HttpClient File Download with Authentication

17 Antworten auf „Angular 5 HttpClient File Download with Authentication“

  1. Thank you for this. You saved the day. Although my http get is without and only with ‚blob‘. There is some angular 5 issue with this.

    Whole service method:

    getShipmentAttachment(shipmentId: number, attachmentId: number): Observable {

    let url: string = this.getFullUrl(/api/v1/shipments/${shipmentId}/attachments/${attachmentId});
    let headers: HttpHeaders = new HttpHeaders().set(‚Authorization‘, this.token);

    return this._httpClient.get(url, {
    headers: headers,
    responseType: ‚blob‘ // very important that this is set

  2. Rob

    This won’t work at all in Angular 6 typescript.
    Also why are you using promises when Angular 2 + has Observables ?

    My service function:
    getEvidenceFile(id: number, getFileContent: boolean) {

    return this.http.get(environment.baseUrl + ‚upload‘ + ‚/‘ + id + ‚,‘ + getFileContent, {responseType: ‚blob‘ as ‚json‘})
    .map(res => res);

    My component function called from the selected item of a dropdown…
    dropDownValue(event: any) {

    // const blob = await this.callService.getEvidenceFile(, true);
    // const url = window.URL.createObjectURL(blob);

    this.callService.getEvidenceFile(, true).subscribe(data => {

    var binaryData = [];
    var downloadLink = document.createElement(‚a‘);
    downloadLink.href = window.URL.createObjectURL(new Blob(binaryData));


    [ts] Property ‚URL‘ does not exist on type ‚ (this: Observable , windowBoundaries: Observable) => Observable<Observable>‘.

  3. tatsu

    createObjectURL went into deprecation 7 years ago and has been effectively deprecated 2 years ago this guide has been unusable for two years. please update it.

    1. Hi tatsu,
      Do you have any source for this? I looked at the Mozilla documentation for URL.createObjectURL and there is no sign of a deprecation: with full support in all major browsers.

      There seems to be a change however, when using a MediaStream with an HTMLMediaElement (like Video) which used to utilize URL.createObjectURL, but doesn’t any more :
      Maybe this is what you are referring to?

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.

Diese Seite verwendet Cookies. Durch die weitere Nutzung der Webseite stimmen Sie der Verwendung von Cookies zu. Weitere Informationen zu Cookies erhalten Sie in unserer Datenschutzerklärung.