Ich habe den folgenden PDF - Stream von einem Server erhalten:
Wie kann dieser Stream in AngularJS gelesen werden? Ich habe versucht, diese Datei als PDF -Datei in einem neuen Fenster zu öffnen, indem Sie folgenden Code verwenden:
.success(function(data) {
window.open("data:application/pdf," + escape(data));
});
Ich kann den Inhalt jedoch nicht in geöffnetem Fenster sehen.
Dies habe ich durch die Änderung meines Controller-Codes erreicht
$http.get('/retrievePDFFiles', {responseType: 'arraybuffer'})
.success(function (data) {
var file = new Blob([data], {type: 'application/pdf'});
var fileURL = URL.createObjectURL(file);
window.open(fileURL);
});
Bitte schauen Sie sich den folgenden Code an:
Auf der Controller-Seite -
$http.get(baseUrl + apiUrl, { responseType: 'arraybuffer' })
.success(function (response) {
var file = new Blob([response], { type: 'application/pdf' });
var fileURL = URL.createObjectURL(file);
$scope.pdfContent = $sce.trustAsResourceUrl(fileURL);
})
.error(function () {
});
Auf HTML-Seite:
<div ng-controller="PDFController" class="modal fade" id="pdfModal" tabindex="-1" role="dialog" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content" onloadstart="">
<object data="{{pdfContent}}" type="application/pdf" style="width:100%; height:1000px" />
</div>
</div>
Sie können auch mit dem Angular ng-pdfviewer gehen und Ihr PDF anzeigen, indem Sie seine js-Dateien verwenden.
Java: Methode abrufen
BLOB pdfData = getBlob_Data;
response.setContentType(pdfData.getContentType());
response.setHeader(ApplicationLiterals.HEADER_KEY_CONTENT, "attachment; filename=FileName.pdf");
response.getOutputStream().write(pdfData.getBinaryData());
response.getOutputStream().flush();
Schauen Sie sich die Datei PDF.JS an. Dies ist eine clientseitige Javascript-Bibliothek, die einen PDF-Stream abrufen und ihn clientseitig darstellen kann. Angular kann keine PDF-Dateien lesen, daher ist dies kein eckiges Problem.
Das Problem bei der Verwendung von config.responseType ist, dass der $ http-Dienst immer noch den Standard-ResponseTransformer ausführt und versucht, die Antwort in JSON zu konvertieren. Außerdem senden Sie die standardmäßigen Accept-Header. Hier ist eine (nicht getestete) Alternative:
$http.get('/retrievePDFFiles', {
headers: { Accept: "application/pdf"},
transformResponse: function(data) {
return new Blob([data], {type: 'application/pdf'});
}}).success(function (data) {
var fileURL = URL.createObjectURL(data);
window.open(fileURL);
});