如何在上传前查看 PDF 文件

Question

我正在执行一些代码以在从我们的计算机中选择 PDF 文件后查看它，但是我遇到了一些错误

我已经尝试使用 'pdf.js'，但出现了一些错误，即 'PDFJS' 或 'pdfjsLib' 未定义

function showInCanvas(url) {

                'use strict';

                var pdfAsArray = convertDataURIToBinary(url);

                pdfjsLib.getDocument(pdfAsArray).then(function (pdf) {

                    pdf.getPage(1).then(function (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;

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

我收到的错误消息是：

Uncaught ReferenceError: pdfjsLib is not defined

Answer 1

为什么你依赖外部库来预览 pdf 文件，即使你可以使用 iframe object.you 只需要从文件控制读取文件并将文件对象分配给 iframe。

   var file =document.getElementById("filecontrol").files[0];
   var url =URL.createObjectURL(file );
   $('#iframeid').attr('src',url);

HTML :

<iframe id="iframeid" width="x" height="y"></iframe>