De rendu PDF à l'aide de PDF.JS et AngularJS à partir du tableau d'octets
J'ai suivi les liens suivants pour essayer de rendre un flux d'octets retournés à partir d'une API pour un PDF dans le navigateur à l'aide de PDF.JS:
- http://codingcrazy87.blogspot.com/2014/05/view-pdf-files-directly-within-browser.html
- https://gist.github.com/fcingolani/3300351
Ici est la JavaScript utilisé pour exécuter le rendu. Remarque: flux est un tableau d'octets retournés à partir d'une API.
var file = new Blob([stream], {type: 'application/pdf'});
var fileURL = URL.createObjectURL(file);
$scope.renderPDF(fileURL, document.getElementById('pdf-holder'));
Ici est $champ d'application.renderPDF:
$scope.renderPDF = function(url, canvasContainer) {
var scale= 1.5; //"zoom" factor for the PDF
function renderPage(page) {
var viewport = page.getViewport(scale);
var canvas = document.createElement('canvas');
var ctx = canvas.getContext('2d');
var renderContext = {
canvasContext: ctx,
viewport: viewport
};
canvas.height = viewport.height;
canvas.width = viewport.width;
canvasContainer.appendChild(canvas);
page.render(renderContext);
}
function renderPages(pdfDoc) {
for(var num = 1; num <= pdfDoc.numPages; num++)
pdfDoc.getPage(num).then(renderPage);
}
PDFJS.disableWorker = true;
PDFJS.getDocument(url).then(renderPages);
}
Ici est la HTML dans ma page modèle:
<script type="text/javascript" src="https://cdn.rawgit.com/mozilla/pdf.js/gh-pages/build/pdf.js"></script>
<div id="pdf-holder">
</div>
Lorsque le code s'exécute
PDFJS.getDocument(url).then(renderPages);
J'obtiens une erreur 404 not Found sur worker.js, ce qui est logique, parce que je suis en suivant ces exemples, et la désactivation de travailleur, de sorte que je ne devrais pas en avoir besoin. Quelqu'un aurait-il des conseils ou un moyen facile de contourner ce que je peux rendre un pdf dans le navigateur à partir d'un flux d'octets?
Qui fonctionne. Je suis maintenant le message d'erreur "non Gérée promesse rejet" de sorte que le getDocument(url) est défectueux. Mon url = blob:http%3A//localhost%3A9000/56cfc1c4-cd80-4284-af8b-a0bdecc163e9 Est-il rien d'évident qui fera de cet échec?
PDF.js les fichiers ne se trouvent pas dans votre localhost? Essayez de le faire fonctionner avec des fichiers situés sur un serveur en premier.
OriginalL'auteur Jeremy Wagner | 2015-02-11
Vous devez vous connecter pour publier un commentaire.
Vous avez encore besoin de pdf.worker.js même si vous avez désactivé. La désactivation cela signifie que PDFJS utilisera les faux travailleurs pour lesquels elle est aussi à l'aide du travailleur de la bibliothèque. Il suffit de le régler de la manière suivante:
OriginalL'auteur FlowPaper Team