Tel Map

Blog

Angular 5 HttpClient File Download with Authentication

10 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
    })
    .pipe(
    catchError(this.handleError)
    );
    }

  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(event.target.value, true);
    // const url = window.URL.createObjectURL(blob);

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

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

    });
    }

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

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.