如何使用cdn导入pdf.js
[英]How to import pdf.js using cdn
问题描述
I wanted to use pdf.js for a project of mine but I faced an issue of importing it, basically, the CDN doesn't work
我想将 pdf.js 用于我的一个项目，但我遇到了导入它的问题，基本上，CDN 不起作用
Here is my code这是我的代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="https://cdn.jsdelivr.net/npm/pdfjs-dist@2.7.570/build/pdf.min.js"></script>
</head>
<body>
<canvas id="my-canvas"></canvas>
<script>
pdfjsLib.getDocument('./ahmed.pdf').then(doc => {
console.log("this file has" + doc._pdfInfo.numPages);
});
</script>
</body>
</html>
and that is the errors that my console shows这就是我的控制台显示的错误
Deprecated API usage: No "GlobalWorkerOptions.workerSrc" specified.
Uncaught TypeError: pdfjsLib.getDocument(...).then is not a function
So what should i do to solve this problem and thank you so much那么我该怎么做才能解决这个问题，非常感谢
2 个解决方案
解决方案1
2 2021-04-06 18:55:54
You have to set GlobalWorkerOptions.workerSrc to /build/pdf.worker(.min).js of same version:您必须将GlobalWorkerOptions.workerSrc设置为相同版本的/build/pdf.worker(.min).js ：
pdfjsLib.GlobalWorkerOptions.workerSrc =
"https://cdn.jsdelivr.net/npm/pdfjs-dist@2.7.570/build/pdf.worker.min.js"; 👈
pdfjsLib.getDocument('./ahmed.pdf').promise.then(doc => {
console.log(`This document has ${doc._pdfInfo.numPages} pages.");
});
And , as @Pasi has mentioned, you have to promisify .getDocument() by chaining .promise on it.而且，正如@Pasi 所提到的，您必须通过在其上链接.promise来承诺.getDocument() 。 Without it, there is no .then() .没有它，就没有.then() 。
解决方案2
1 2021-04-06 18:43:49
See the "Hello World with document load error handling" example on this page to get started: https://mozilla.github.io/pdf.js/examples/请参阅此页面上的“带有文档加载错误处理的 Hello World”示例以开始使用： https://mozilla.github.io/pdf.js/examples/
(Your snippet is missing .promise after getDocument() and setting the workerSrc property) （您的代码片段在getDocument()和设置workerSrc属性之后缺少.promise ）
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.