pdfjs 与 magento 2

Question

我可以将 pdfjs 与 magento 2 requireJS 集成。已从此处下载文件：https://cdnjs.com/libraries/pdf.js 并将它们放在 my_theme/web/js/ 文件夹中

将 pdfjs 添加到 requirejs 脚本：

my_theme/web/js/requirejs-config.js

var config = {
    paths: {
        'pdfjs-dist/build/pdf': 'js/pdf.min',
        'pdfjs-dist/build/pdf.worker': 'js/pdf.worker.min'
    }
};

将脚本添加到页面：

require(["js/pdf", "js/pdf.worker"],function(pdfjsLib, pdfWorker){
  //define url other parts of script..
  pdfjsLib.getDocument(url).promise.then(function(pdfDoc_) {
    pdfDoc = pdfDoc_;
    document.getElementById('page_count').textContent = pdfDoc.numPages;

    // Initial/first page rendering
    renderPage(pageNum);
  });
});

脚本已加载我可以看到 pdf.min.js 和 pdf.worker.min.js 都加载了 magento。

但仍然出现以下错误：无法读取未定义的属性 'getDocument'。来自测试的两个变量都未定义：pdfjsLib、pdfWorker

知道这里出了什么问题吗？

如果我们使用： require(["pdfjs-dist/build/pdf", "pdfjs-dist/build/pdf.worker"],function(pdfjsLib, pdfWorker){

我们得到 404，因为它将尝试从 website/pub/static/vendor/theme/pdfjs-dist/build/pdf.min.js

加载脚本

但文件位于 website/pub/static/vendor/theme/js/pdf。min.js

Answer 1

我没有 Magento2 设置，但我做了一个简单的 HTML 设置并且它正在运行：

<script src="https://cdnjs.cloudflare.com/ajax/libs/require.js/2.3.6/require.min.js"></script>
<script>
    var config = {
        paths: {
            'pdfjs-dist/build/pdf': 'https://cdnjs.cloudflare.com/ajax/libs/pdf.js/2.6.347/pdf.min',
            'pdfjs-dist/build/pdf.worker': 'https://cdnjs.cloudflare.com/ajax/libs/pdf.js/2.6.347/pdf.worker.min'
        }
    };
    requirejs.config(config);
    require(["pdfjs-dist/build/pdf", "pdfjs-dist/build/pdf.worker"],function(pdfjsLib, pdfWorker){
        console.log(pdfjsLib, pdfWorker);
    });
</script>

也许这会对你有所帮助:)

pdfjs 与 magento 2

pdfjs with magento 2

javascript

requirejs

magento2

pdf.js