PDF.JS pdfからbase64 pngをキャンバスタグに変換していますか？

Question

私はMozillaでPDF.JSライブラリでpdfを変換して作成したキャンバスからbase64でエンコードされたpng値を取得しようとしています。

私はHTMLキャンバスに変換したbase64でエンコードされたPDFを持っていました。私は今、HTMLキャンバスを適切に表示するHTML imgタグで使用できるbase64でエンコードされたpng値に変換する必要があります。

私はHTMLCanvasElement.toDataURL（）を試しましたが、何も表示されませんでした。私はキャンバスに描かれたいくつかの緑色のボックスで同じ方法を試してみましたが、うまくいきました。つまり、base64でエンコードされたpdfをキャンバスに変換しても、その方法では動作しません。

私が試した解決策の他の解決策または回避策はありますか？

**私のHTMLでJSコード内でこれを行う必要があります。

function convertDataURIToBinary() { 
     var raw = window.atob(BASE64 OF PDF); 
     var rawLength = raw.length; 
     var array = new Uint8Array(new ArrayBuffer(rawLength)); 

     for(var i = 0; i < rawLength; i++) { 
     array[i] = raw.charCodeAt(i); 
     } 
     return array; 
    } 
    var pdfAsArray = convertDataURIToBinary(); 

    PDFJS.workerSrc = "http://mozilla.github.io/pdf.js/build/pdf.worker.js"; 
    var canvas = _el.querySelector(".insertHere"); 
    PDFJS.getDocument(pdfAsArray).then(function getPdfHelloWorld(pdf) { 
     pdf.getPage(1).then(function getPageHelloWorld(page) { 
     var scale = 1.5; 
     var viewport = page.getViewport(scale); 


     var context = canvas.getContext("2d"); 
     canvas.height = viewport.height; 
     canvas.width = viewport.width; 

     var renderContext = { 
      canvasContext: context, 
      viewport: viewport 
     }; 
     page.render(renderContext); 
     canvas = _el.querySelector(".insertHere"); 
     var imgSrc = canvas.toDataURL("image/png"); 
     var img = new Image(); 
     img.src = imgSrc; 
     _el.querySelector(".insertImageLabel").appendChild(img); 

     }); 
    }); 

Answer 1

非同期操作を終了するためにrender（）が返す約束を待っているわけではありません。完了時にはhttps://github.com/mozilla/pdf.js/blob/master/examples/learning/prevnext.html#L76を参照してください。

... 
    var renderTask = page.render(renderContext); 
    // Wait for rendering to finish 
    renderTask.promise.then(function() { 
    // Page rendered, now take snapshot. 
    }); 
    ...