pdfjs与magento 2答案

【问题标题】：pdfjs with magento 2pdfjs与magento 2
【发布时间】：2021-01-21 05:48:13
【问题描述】：

我可以将 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

【问题讨论】：

标签： javascript requirejs magento2 pdfjs

【解决方案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>

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

【讨论】：