1

We have a Post rest service written in Spring. The response of this service is a json which includes a few string parameters and a byte array. The byte array can be for any type of file.

This service is to be consumed by and Angular application written in Angular 4. On the Angular page, we want to download this file on click of a button. The below code, hits the rest service, gets the correct response data, but the file that it downloads is corrupt.

I have taken a jpg file for sample and while trying to open the downloaded file, i get an error "We can't open this file". We have verified that the byte array, received in the response, is intact.

bmsService.service.ts

viewDocument(inputdata: String) {
console.log(inputdata);
this.HEADERS.append('Content-Type', 'application/json');
return this.http.post(
    VIEW_DOCUMENT_URL, 
    inputdata, 
    {headers:this.HEADERS}
 ).map((res: Response) => res.json());
}

app.component.ts

openViewPopUp(docId: String) {

let attachmentRequest = new AttachmentRequest();
attachmentRequest.docId = docId;
this.bmsService.viewDocument(JSON.stringify(attachmentRequest)).subscribe(
  response => {
    console.log(response);
    let contentType = 'application/octet-stream';
    let blob = new Blob([response.fileBytes], { type: contentType });
    let link=document.createElement('a');
    link.href=window.URL.createObjectURL(blob);
    link.download="Case5_Evidence.jpg";
    link.click();
  },
  err => {
    console.log(err);
  });
}

openViewPopUp() method is invoked on click of the button. The browser being used is IE11.

0 Answers0