I am reading a pdf in the server (SpringBoot) and return it as a byte array to be opened in a new tab. On the client-side (Angular) I am consuming it as a blob. I am then trying to open the pdf in a new tab
service.ts file
getPdf(httpHeaders: HttpHeaders): Observable<any> {
return this.http.get(this.getServerUrl() + 'dummypdf', {
observe: 'response',
responseType: 'blob',
headers: httpHeaders
});
}
Component.ts file
openPdf(){
this.service.getPdf(generateRequestId()).subscribe(file => {
let blobData = new Blob([file.body], {
type: 'application/pdf'
});
let fileData = new File([file.body], "name", {type: 'application/pdf'});
let fileURL = window.URL.createObjectURL(fileData);
window.open(fileURL,"_blank")
})
}
I am able to open the pdf in the new tab. Everything is fine. But the blob URL appears as such
blob:http://localhost:4200/ba35a67c-571e-4450-bda4-b438dc8d6d8e
I do understand that it is because of the memory location from where it is reading and also it is not customizable.
My question is, Is there any alternative approach to this. Like perhaps not consume it as a blob or not sending it as a byte array from the server?