Pdf viewer issue

Technical Support
1

am using PDFJSExpress

PDF.js Express Version :

“@pdftron/pdfjs-express”: “^8.7.5”,
“@pdftron/pdfjs-express-viewer”: “^8.7.5”,
“@react-pdf-viewer/core”: “^3.12.0”,

Expected behaviour
the pdf view is not working it gives this error https://example.com/n.pdf. cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at

useEffect(() => {
    // Only initialize WebViewer if documentUrl exists and WebViewer is not already initialized
    const viewerElement = document.getElementById('viewer');
    if (documentUrl && !viewerElement.dataset.initialized) {
      WebViewer({
        path: '/pdfjsexpress', 
        licenseKey: '....', 
        initialDoc: documentUrl,
      }, viewerElement)
        .then(instance => {
          const { UI } = instance;
          UI.disableElements(['downloadButton', 'printButton']);
          
          UI.setHeaderItems(header => {
            header.update([
              { type: 'toggleElementButton', element: 'leftPanelButton' },
              { type: 'toggleElementButton', element: 'searchButton' },
              { type: 'spacer' },
              { type: 'toggleElementButton', element: 'zoomOverlayButton' },
            ]);
          });

          // Mark the viewer as initialized
          viewerElement.dataset.initialized = true;
        })
        .catch(error => {
          console.error("Error initializing PDF.js Express:", error);
        });
    }
  }, [documentUrl]);
2

Hello Marwa,

You may need to modify the server hosting the PDF file (https://example.com/n.pdf) to include the necessary CORS headers in its response. Specifically, the Access-Control-Allow-Origin header should be set to allow requests from the domain where your application is hosted.

Best Regards,
Darian