I'm facing an issue while attempting to download a PDF file using the $http service in AngularJS.
Upon trying to open the downloaded file, I encounter an error message stating "Invalid Color Space" and the page appears blank.
To troubleshoot this problem, I performed the following checks:
- When inspecting the Firefox developer console under Network tab, I can see the response object from the ajax call.
- I set a breakpoint in my code and examined the response object returned from $http.
Interestingly, I noticed that these two responses are different. For example:
- From developer console:
"%PDF-1.4 %.........
- From the $http:
%PDF-1.4 %äãÏÒ.........
This inconsistency persists throughout the entire document.
What could be causing this discrepancy?
P.S. Here is the relevant code snippet:
downloadService.downloadPDF(response.url).then(
function(response) {
if (response) {
var aTag = document.getElementById('downloadFile');
aTag.setAttribute('href', 'data:application/pdf;charset=utf-8,' + encodeURIComponent(response));
aTag.setAttribute('download', $scope.data.filename);
aTag.click();
}
});
Response Headers:
Cache-Control:max-age=3600, must-revalidate
Content-Disposition:inline; filename=4550f2025f45cc2d14a403fbc1840160d4d052e4_598551722_300501.pdf
Content-Type:application/pdf
Date:Tue, 23 Oct 2018 11:17:44 GMT
Expires:0
Pragma:public
Server:Apache-Coyote/1.1
Set-Cookie:JSESSIONID=Y0kTkAV7GJLVRK1fKuZfffff; Expires=Thu, 01-Jan-1970 00:00:10 GMT; Path=/appbase; HttpOnly
Transfer-Encoding:chunked