Javascript 本地安装的PDF.JS不会呈现

当尝试使用npm安装的pdfjs中的PDF.JS时，如果控制台上没有显示任何错误，则不会呈现PDF

当使用在线源代码（例如

//mozilla.github.io/pdf.js/build/pdf.worker.js

）时，pdf的呈现效果很好

这是我正在使用的代码，几乎直接取自：

PDF.js“你好，世界！”例子
var url='1〕https://raw.githubusercontent.com/mozilla/pdf.js/ ba2deae/examples/learning/helloworld.pdf'；
//通过标签加载，创建访问PDF.js导出的快捷方式。
var pdfjsLib=window['pdfjs-dist/build/pdf']；
//应规定工人的财产。
pdfjsLib.GlobalWorkerOptions.workerSrc='node_modules/pdfjs dist/build/pdf.worker.js'；
//PDF的异步下载
var loadingTask=pdfjsLib.getDocument（url）；
loadingTask.promise.then（函数（pdf）{
console.log（'PDF-loaded'）；
//取第一页
var pageNumber=1；
getPage（页码）。然后（函数（第页）{
console.log（“页面加载”）；
var标度=1.5；
var viewport=page.getViewport（{scale:scale}）；
//使用PDF页面维度准备画布
var canvas=document.getElementById（'the-canvas'）；
var context=canvas.getContext（'2d'）；
canvas.height=viewport.height；
canvas.width=viewport.width；
//将PDF页面呈现到画布上下文中
var renderContext={
背景：背景，
视口：视口
};
var renderTask=page.render（renderContext）；
renderTask.promise.then（函数（）{
log（“呈现的页面”）；
});
});
}，功能（原因）{
//PDF加载错误
控制台错误（原因）；
});

这是通过PDFJS的远程版本实现的

这是通过本地（npm）版本实现的

---

我不确定您在实现上述代码时到底遇到了什么错误。更具体地说-浏览器中的控制台错误

我的实现方式与您的相同，即本地实现，但不使用节点模块。我从PDFJS网站下载了最新的dist文件夹-

为了使代码在演示中正常工作，我做了以下更改

1） 复制内容并保存到JS文件pdf.JS中

2） 包括顶部HTML页面中的文件

<script src="pdfjs-2.2.228-dist/build"></script>
<script src="pdf.js"></script>

我还没有尝试过，但将url更改为path

pdfjs-2.2.228-dist/build/pdf.worker.js

也应该可以

---

希望这对你有帮助

如果您可以访问HTML，则可以直接将此代码嵌入正文部分，以显示用户友好的pdf查看器，而不是通过js脚本实现，如本文所述

<script src="pdfjs-2.2.228-dist/build"></script>
<script src="pdf.js"></script>

// Loaded via <script> tag, create shortcut to access PDF.js exports.
//var pdfjsLib = window['pdfjs-dist/build/pdf'];

// The workerSrc property shall be specified.
pdfjsLib.GlobalWorkerOptions.workerSrc = 'http://mozilla.github.io/pdf.js/build/pdf.worker.js';

<iframe
    src="path-to-viewer-inside-web-folder/viewer.html?file=path-to-pdf-file/test.pdf"
    width="800px"
    height="600px"
    style="border: none;" />