我在使用全局工作线程和异步时遇到 PDF.JS 错误

Question

我的 pdfjs 脚本有问题。

我第一次尝试，我收到了这条消息：

已弃用的 API 用法：未指定“GlobalWorkerOptions.workerSrc”。 未捕获的异常：未定义

所以我遵循github上的文档：https://github.com/mozilla/pdf.js/issues/10478

现在我收到此消息：SyntaxError：await仅在异步函数和异步生成器中有效

<div class="d-flex justify-content-center">
    <canvas id="pdf-render">

    </canvas>
</div>

    <div class="pdfcontroller d-flex justify-content-around">
        <button class="btn btn-primary" id="prev-page">
            prev page
        </button>
        <p class="page-info"> 1 / 2</p>
        <button class="btn btn-primary" id="next-page">
            Next page
        </button>
    </div>
    <script
            src="https://cdnjs.cloudflare.com/ajax/libs/pdf.js/2.4.456/pdf.min.js">
    </script>
    <script>
        const url = 'filesample.pdf'

        let pdfDoc = null;
        pageNum = 1;
        pageIsrendreing = false;

        pageNumisPending = null;

        const scale = 1.5,
            canvas = document.querySelector('#pdf-render'),

            ctx = canvas.getContext('2d');


        // Render the page

        const renderPage = num =>{

        }

        // Get the doc


        const pdfjs = await import('pdfjs-dist/build/pdf');
        const pdfjsWorker = await import('pdfjs-dist/build/pdf.worker.entry');

        pdfjs.GlobalWorkerOptions.workerSrc = pdfjsWorker;

       pdfjsLib.getDocument(url).promise.then(pdfDoc_  => {
           pdfDoc = pdfDoc_;
           console.log(pdfDoc)



       });

    </script>

Answer 1

这与 PDF.js 没有任何关系。正如它所述，您不能在异步函数之外使用异步等待语法。只需将所有内容放入一个函数中即可，例如

async function init() {}

并在窗口加载时调用它。

Answer 2

你应该尝试这个：

const pdfjs = await import('pdfjs-dist/build/pdf');
const pdfjsWorker = await import('pdfjs-dist/build/pdf.worker.entry');

pdfjs.GlobalWorkerOptions.workerSrc = pdfjsWorker;

...