上传前如何查看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

为什么即使您可以使用iframe对象也可以依靠外部库来预览pdf文件，您只需要从文件控件中读取文件并将文件对象分配给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>