Как читать поток PDF в angularjs

Я получил следующий поток PDF с сервера: PDF STREAM

Как этот поток можно прочитать в AngularJS? Я попытался открыть это как файл PDF в новом окне, используя следующий код:

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

Но я не могу видеть содержимое в открытом окне.


person User4567    schedule 11.09.2014    source источник
comment
почему вы передаете весь файл через http, а не просто открываете URL-адрес этого файла? окно.открыть (URL-адрес файла)?   -  person Marian Ban    schedule 11.09.2014
comment
@MajoB Я тоже пытался таким образом, но в angular я получаю сообщение об ошибке, например, Не разрешено загружать локальный ресурс: не удалось загрузить путь к файлу ..   -  person User4567    schedule 11.09.2014
comment
См. этот ответ: stackoverflow.com/questions/21628378/   -  person stacky    schedule 11.09.2014
comment
Привет, я получаю такой же ответ в Angular2, но я не могу понять, как обрабатывать такой ответ в angular 2. Я получаю сообщение об ошибке SyntaxError: Unexpected token % in JSON in position 0 at JSON.parse (‹anonymous ›) в Function.Json.parse вот так.   -  person monica    schedule 28.11.2016


Ответы (5)


Я достиг этого, изменив код моего контроллера

$http.get('/retrievePDFFiles', {responseType: 'arraybuffer'})
       .success(function (data) {
           var file = new Blob([data], {type: 'application/pdf'});
           var fileURL = URL.createObjectURL(file);
           window.open(fileURL);
    });
person User4567    schedule 12.09.2014
comment
Ранджит, я получал пустой pdf, но добавлял responseType к аргументам $http, это работало. Я только что понял, извините за опоздание. - person Andres Felipe; 01.04.2016
comment
привет, я получаю ту же ошибку, что и Ранджит. В хроме пишет: Не удалось загрузить документ PDF. Вы знаете, как это решить? - person Luis Becerril; 15.05.2016
comment
Я все еще получаю ту же ошибку, даже после применения исправления. - person Sachin Sharma; 01.06.2016
comment
@RanjitSingh см. этот ответ и замените $window.open($sce.trustAsResourceUrl(fileURL)); - person oCcSking; 05.01.2017
comment
как вызвать диалоговое окно загрузки, а не открывать его в новой вкладке? - person Sateesh Kumar Alli; 28.03.2017
comment
@MPPNBD понятия не имею, но я постараюсь сообщить вам. - person User4567; 01.06.2018
comment
{responseType: 'arraybuffer'} помог мне. Я отправляю MemoryStream из .NET Core и делаю $http.post из Angularjs следующим образом: return this.$http.post(url, Indata, { responseType: 'arraybuffer' }) .then(res =› { return res }); - person Shezi; 29.06.2018

Пожалуйста, взгляните на следующий код:

На стороне контроллера -

$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:

<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>

Также вы можете воспользоваться Angular ng-pdfviewer и просмотреть свой PDF-файл, используя его js-файлы.

person Gurupreet    schedule 11.06.2015

Взгляните на PDF.JS. Это библиотека javascript на стороне клиента, которая может извлекать поток PDF и отображать его на стороне клиента. Angular не может прочитать PDF-файл, так что это не проблема angular.

person Lee Willis    schedule 11.09.2014

Java: метод получения

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();
person Vinay Adki    schedule 26.02.2016
comment
Контроллер: function downloadPDF(searchManagerQuery) { // вызывает метод get $window.open('ServiceURL', '_blank'); } - person Vinay Adki; 26.02.2016

Проблема с использованием config.responseType заключается в том, что служба $http по-прежнему запускает responseTransformer по умолчанию и пытается преобразовать ответ в JSON. Кроме того, вы отправляете заголовки принятия по умолчанию. Вот (непроверенный) вариант:

$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);
    });
person Ed Greaves    schedule 21.04.2017