簡體   English   中英

JavaScript:將 pdf 轉換為字節數組並使用 HTML5 在 UI 中呈現 pdf

[英]JavaScript: converting pdf to bytes array and rendering the pdf in UI using HTML5

我需要以下兩件事的幫助

1)我需要在 JavaScript 中將 PDF 文件數據轉換為字節數組。

2) 使用上面的字節數組,我需要在 UI 中將它呈現為 PDF 文件。

問題可能看起來像,為什么我想將 PDF 文件轉換為字節流,以及為什么我想在 UI 中將其顯示為 PDF。 但是我需要為以上兩個找到一種方法來幫助我解決項目中的許多問題。

任何閱讀建議或上述問題的解決方案都將是值得贊賞的。

謝謝你的時間!

請檢查pdf.js。 它可能會有所幫助http://mozilla.github.io/pdf.js

以下代碼將在本地讀取文件並呈現 PDF。 這會更快,因為文件不必上傳到服務器並再次下載到瀏覽器。

<script type="text/javascript">
//Workaround for a bug on IE.
PDFJS.workerSrc = "pdf.worker.js";

//File from the input element                
inputElement.onchange = function(event) {

    var file = event.target.files[0];
    //Read the file locally using file reader
    var fileReader = new FileReader();  

    fileReader.onload = function() {
        var typedarray = new Uint8Array(this.result);

        // Render PDF
        PDFJS.getDocument(typedarray).then(function(pdf) {

            pdf.getPage(1).then(function getPageHelloWorld(page) {

                var scale = 1.5;
                var viewport = page.getViewport(scale);

                var canvas = document.getElementById('the-canvas');
                var context = canvas.getContext('2d');
                canvas.height = viewport.height;
                canvas.width = viewport.width;

                page.render({canvasContext: context, viewport: viewport});
            });
        });
    };

    // Read the file into array buffer.
    fileReader.readAsArrayBuffer(file);
}
</script>

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM