it-swarm.com.de

Wie liest man den pdf-Stream in anglejs?

Ich habe den folgenden PDF - Stream von einem Server erhalten: PDF STREAM

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.

30
User4567

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);
    });
48
User4567

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.

7
Gurupreet

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();
1
Vinay Adki

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.

1
Lee Willis

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);
    });
1
Ed Greaves