Webviewer on app served on a custom path

Product: Webviewer for the browser

Product Version: 8.5.0

Please give a brief summary of your issue:
Webviewer worker fails to load for an app served from a custom path e.g. https://example.com/some/path/app

Please describe your issue and provide steps to reproduce it:
I’m working with an Angular 13 application, which uses the webviewer npm package. I have to note that an iframe isn’t used, but the viewer is initialized manually (the iframe isn’t used because we want to build an entirely custom UI, among other reasons)

Locally the webviewer works fine and displays the, but in my dev environment hosted on e.g. domain.com/env/app, the following exceptions are observed:

ERROR Error: Uncaught (in promise): WorkerError: The worker has encountered an error

NetworkError: WorkerGlobalScope.importScripts: Failed to load worker script at blob:https://example.com/40ca99bf-ecb2-4f6f-ad45-e133dae39544 (nsresult = 0x805e0006)

Failed to find PDF worker files. This project is not set up to work with PDF files.

ERROR Error: Uncaught (in promise): Error: Failed to find PDF worker files. This project is not set up to work with PDF files.

All webviewer files are returned with a HTTP 200 code, no 404 are observed.

Please provide a link to a minimal sample where the issue is reproducible:
Unfortunately I can’t provision the infrastructure to reproduce the error at the moment, but I hope to get some insight from the development team as to why this error might occur as I think this might be a simple configuration issue on my part. If it is necessary, I can invest the time to try and reproduce it on a publicly available application, but here’s the relevant code from the angular application:

It’s defined in angular.json to copy the assets from “node_modules/@pdftron/webviewer/public” to “/assets/pdftron” and “node_modules/@pdftron/webviewer/public/core/webviewer-core.min.js” is injected into the index.html template.

The relevant code used to initialize the webviewer is (edited for brevity):

Core.setWorkerPath('assets/pdftron/core');

@Injectable()
export class DocumentService {
  private documentViewer: LibCore.DocumentViewer = new Core.DocumentViewer();
  // ...
  constructor() {
    this.documentViewer.enableAnnotations();
    // ...
    this.documentViewer.setScrollViewElement(scrollViewElement);
    this.documentViewer.setViewerElement(viewerElement);
    // ...
    Core.createDocument(someBlob, {
      extension: 'pdf',
    }).then((pdfDoc) => {
      this.documentViewer.loadDocument(pdfDoc);
    }),
  }
}

In case the app isn’t served from the domain root, do I have to provide the full path for setWorkerPath? That’s a thing i haven’t tried yet.

The app being deployed on a non-domain root might even not be the cause of the problem, but that’s the only thing, I think, that might be causing the issue since running a production build locally works without any issues.

Hello rihards.paskausks,

Welcome to the PDFTron Community Forum!

We have a guide here on running without our UI: PDFTron Systems Inc. | Documentation

Let me know if that works for you!

Best regards,
Tyler Gordon
Web Development Support Engineer
PDFTron

Hey!

Yeah, I used the react app as a reference.

After further debugging, the issue ended up being our content security policy setup - PDFTron Systems Inc. | Documentation

To further emphasize, the nsresult = 0x805e0006 was a mozilla error code which led us to the correct path.