2014-09-11 9 views
24

ich habe folgende PDF-Stream von einem Server zu lesen? Ich habe versucht, diese als PDF-Datei zu öffnen in einem neuen Fenster, indem Sie den folgenden Code:Wie pdf-Stream in AngularJS

.success(function(data) { 
    window.open("data:application/pdf," + escape(data)); 
}); 

Aber ich bin nicht in der Lage, den Inhalt in geöffneten Fenstern zu sehen.

+1

Warum übertragen Sie die gesamte Datei über HTTP und nicht nur die URL dieser Datei öffnen? window.open (DateiUrl)? –

+0

@MajoB ich auf diese Weise auch versucht, aber in Winkel ich Fehler immer nicht wie lokale Ressource zu laden erlaubt: failed Dateipfad laden .. – Lakshman

+1

diese Antwort Siehe: http://stackoverflow.com/questions/21628378/angularjs -Display-Blob-pdf-in-einem-Winkel-App – stacky

Antwort

42

ich erreicht dies durch meine Controller-Code

$http.get('/retrievePDFFiles', {responseType: 'arraybuffer'}) 
     .success(function (data) { 
      var file = new Blob([data], {type: 'application/pdf'}); 
      var fileURL = URL.createObjectURL(file); 
      window.open(fileURL); 
    }); 
+13

ich dieses code..but verwendet leer pdf bekommen –

+7

Ranjit, ich leer pdf war immer aber das Hinzufügen der „response“ auf die Argumente der $ http, es funktioniert. Ich habe es gerade herausgefunden, tut mir leid, dass ich zu spät bin. –

+1

Hallo ich bekomme einen ähnlichen Fehler wie Ranjit. Auf Chrom heißt es: _Failed to PDF-Dokument laden_ wissen Sie, wie man das löst? –

1

Werfen Sie einen Blick auf PDF.JS. Dies ist eine clientseitige JavaScript-Bibliothek, die einen PDF-Stream abrufen und auf der Client-Seite rendern kann. Angular ist nicht in der Lage, eine PDF-Datei zu lesen.

6

Pleas haben einen Blick auf den folgenden Code zu ändern:

Steuerungsseite -

$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() {       
      }); 

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 Ihre PDF-Datei mit den js-Dateien anzeigen.

+0

ng-pdfviewer akzeptiert pdfContent nicht als src – UCJava

1

Java: Get-Methode

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(); 
+0

Controller: Funktion downloadPDF (searchManagerQuery) { // Aufrufe get Methode $ window.open ('ServiceURL', '_blank'); } –

1

Das Problem mit config.responseType ist, dass der $ HTTP-Dienst läuft noch die Standard-responseTransformer und versucht, die Antwort auf JSON zu konvertieren. Außerdem senden Sie die Standardannahme-Header. Hier ist eine (ungeprüfte) Alternative: