Wie rendere ich ein gesamtes PDF-Dokument mit der pdf.js-Bibliothek?

Ich habe versucht, ein PDF-Dokument mit der Bibliothek pdf.js zu rendern. Ich kenne nur die Grundlagen von Javascript und bin neu in Versprechungen, daher habe ich zuerst den Rat auf dieser Seite befolgt:Rendern Sie PDF-Dateien mit pdf.js und ImageData auf eine einzelne Leinwand (2. Antwort).
Als Ergebnis habe ich mein Dokument jedoch mit leeren Seiten gerendert. Alle Bilder und Farben sind in Ordnung, aber nicht einmal eine Textzeile. Ich habe auch einige andere Tutorials ausprobiert, aber entweder erhalte ich das gleiche Ergebnis oder das Dokument fehlt vollständig. Im Moment sieht mein Code so aus: (Es ist fast identisch mit dem Tutorial)

function loadPDFJS(pid, pageUrl){

    PDFJS.disableWorker = true;
    PDFJS.workerSrc = 'pdfjs/build/pdf.worker.js';

    var canvas = document.createElement('canvas');
    var ctx = canvas.getContext('2d');
    var pages = [];
    var currentPage = 1;

    var url = '/search/nimg/IMG_FULL/' + pid + '#page=1';

    PDFJS.getDocument(url).then(function (pdf) {

        if(currentPage <= pdf.numPages) getPage();

        function getPage() {
            pdf.getPage(currentPage).then(function(page){
                var scale = 1.5;
                var viewport = page.getViewport(scale);

                canvas.height = viewport.height;
                canvas.width = viewport.width;

                var renderContext = {
                    canvasContext: ctx,
                    viewport: viewport
                };

                page.render(renderContext).then(function() {
                    pages.push(canvas.toDataURL());
                    if(currentPage < pdf.numPages) {
                        currentPage++;
                        getPage();
                    } else {
                        done();
                    }
                });
            });
        }
    });

    function done() {
        for(var i = 0; i < pages.length; i++){
            drawPage(i, addPage);
        }
    }

    function addPage(img){
        document.body.appendChild(img);
    }

    function drawPage(index, callback){
        var img = new Image;
        img.onload = function() {
            ctx.drawImage(this, 0, 0, ctx.canvas.width, ctx.canvas.height);
            callback(this);
        }
        img.src = pages[index];
    }
}

Antworten auf die Frage(4)

Ihre Antwort auf die Frage