rest - Javascript - Skriv ut Blob-innehåll som returneras från API


Jag bygger en sida för min angular2 webbapplikation där en användare kan välja kunder från en lista och skriva ut brev för att skicka dem. Dessa brev laddades upp som PDF-filer och lagras som varbinary i databasen.

I fallet med flera val bifogar jag helt enkelt byte[] så att användaren kan skriva ut ett dokument som innehåller alla brev att skicka till kunder.

Jag kan framgångsrikt hämta blobben från API:et och returnera den med innehållstypen application-pdf, men sedan vet jag inte vad jag ska göra med den därifrån.

Här är mitt Angular2-komponent API-anrop:

this.printQueueService.getPrintContent(printRequests) //customers to receive letters
            .subscribe((data: Blob) => {
                var element: HTMLIFrameElement = <HTMLIFrameElement>document.getElementById('printFile');
                element.innerText = data + ""; //what do I do with the blob?
                element.contentWindow.print();
});

HTML-element:

<iframe id="printFile" style="display:none"></iframe>

Jag vet att jag bara kan ladda ner PDF:en och uppmana användaren att skriva ut den med en PDF-läsare, men jag vill helst inte tvinga användare att gå igenom extra steg.

Jag skulle också hellre inte försöka visa PDF:en i webbläsaren och skriva ut den eftersom det förutsätter att användarna har rätt tillägg och att webbläsarna stödjer det.

Vilka alternativ har jag för att skriva ut en blob i webbläsaren?

Svar #1

Enligt förslag från Daniel A. White löste jag detta problem. Jag beslutade att inte använda en IFrame eftersom dessa utskriftsfiler kan vara enorma och print()-funktionen inkluderar sidans namn som sidfot.

Istället valde jag att öppna den genererade PDF:en i en ny flik enligt följande:

if (window.navigator.msSaveOrOpenBlob) {
     window.navigator.msSaveOrOpenBlob(data, "PrintedLetters.pdf"); //IE is the worst!!!
}
else {
     var fileURL = URL.createObjectURL(data);
     var a: HTMLAnchorElement = document.createElement('a');
     a.href = fileURL;
     a.target = '_blank';
     document.body.appendChild(a);
     a.click();
}

Relaterade artiklar