CODEWITHSUNDEEP
angularservice
Mahdi
Mahdi

Reputation: 416

file download is damaged when use observe: response in angular service

when I use observe: 'response' in angular service. To get the file name from the header and download it. The file is corrupted.

 return this.http.get(url, {observe: 'response', responseType: 'blob'});


    downloadLicenseFile() {
        let fileName;
        this.loading = true;
        this.licenseService.downLoadFile().subscribe(
            (success) => {
                fileName = success.headers.get('content-disposition').split('filename=')[1].replace(/['"]+/g, '');
                this.loading = false;
                this.validateNext = false;
                this.saveData(success, fileName);
            }, () => {
                this.validateNext = true;
                this.loading = false;
            });
    }


    saveData(data, fileName) {
        const a = document.createElement('a');
        document.body.appendChild(a);
        a.style.display = 'none';
        const blob = new Blob([data], { type: 'application/gzip' });
        const url = window.URL.createObjectURL(blob);
        a.href = url;
        a.download = fileName;
        a.click();
        window.URL.revokeObjectURL(url);
    }

If I delete observe: 'response', the downloaded file is correct.

Upvotes: 1

Views: 573

Answers (1)

Maryam Rajabi
Maryam Rajabi

Reputation: 39

This is very easy. You should use success.body instead success.

this.saveData(success.body, fileName);

Because when you use observe: 'response', the type of data received changes

Upvotes: 2

Related Questions