Display pdf in a new tab with custom filename

Viewed 870

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?

0 Answers
Related