I have an error with PDF.JS with the global worker and the async

Question

I have an issue with my script on pdfjs.

i try a first time and i have this message :

Deprecated API usage: No "GlobalWorkerOptions.workerSrc" specified. uncaught exception: undefined

so i follow the docs on github : https://github.com/mozilla/pdf.js/issues/10478

and now i have this message : SyntaxError: await is only valid in async functions and async generators

<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>

Stob

Answer 1

You should try this:

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

pdfjs.GlobalWorkerOptions.workerSrc = pdfjsWorker;

...

Polaroid

Answer 2

That doesn't have anything to do with PDF.js. As it states, you can't use the async await syntax outside of an async function. Just put everything inside a function e.g. async function init() {} and call it when the window is loaded.

Improvident

can you show how to do that. Include a sample, so everyone can know. – Rewarding

@ArunPrasadES async function init() { const pdfjs = await import('pdfjs-dist/build/pdf'); const pdfjsWorker = await import('pdfjs-dist/build/pdf.worker.entry'); pdfjs.GlobalWorkerOptions.workerSrc = pdfjsWorker; } window.onload = () => {init()} – Informative

Note: after you did this change pdfjsLib to pdfjs – Informative

but @Improvident why it works? – Informative