ngx-extended-pdf-viewer: "window.PDFViewerApplication.eventBus is null" when loading from a file or base64 pdf

When trying a minimal example to test the plugin out I get this error, when I’m loading from a file or from a Base64 encoding. Ideally I would like to load the Base64 representation.

Here is the error itself:

ERROR TypeError: "window.PDFViewerApplication.eventBus is null"
    initTimeout ngx-extended-pdf-viewer.js:314
    Angular 7
core.js:15724

I am running this on Windows 10

I have created a repo in which I have reproduced the bug. The repo includes a base64 encoded pdf. Here it is https://github.com/Stromwerk/pdf-viewer-reproducer

About this issue

  • Original URL
  • State: closed
  • Created 5 years ago
  • Comments: 17 (10 by maintainers)

Commits related to this issue

Most upvoted comments

I’ve added more flexibility to the [src] attribute. Now it accepts ArrayBuffers, Uint8Arrays and - of course - URL strings.

If the URL is unuasually long (> 980 characters), ngx-extended-pdf-viewer checks if it’s an Base64 string. If that’s likely, it print a warning to the console, telling you to use the new [base64Src] attribute instead.

Which is the second news: you don’t have to wrap your base64 string if you update to version 0.9.21 or above. Using [base64Src] does the trick just as well.

I’ve published 0.9.21 just a few minutes ago, so it should be available to your npm soon.

The secret is to pass an ArrayBuffer to the url parameter:

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})

export class AppComponent {
  public base64 = this.base64ToArrayBuffer(pdfBase64);

  private base64ToArrayBuffer(base64: string) {
    const binary_string = window.atob(base64);
    const len = binary_string.length;
    const bytes = new Uint8Array(len);
    for (let i = 0; i < len; i++) {
      bytes[i] = binary_string.charCodeAt(i);
    }
    return bytes.buffer;
  }
}
      <ngx-extended-pdf-viewer  [src]="base64">
      </ngx-extended-pdf-viewer>

I’ve added your demo to the test application of ngx-extended-pdf-viewer (see https://github.com/stephanrauh/ngx-extended-pdf-viewer/commit/580527b1833b7138720c2181fd2f45bde614c39c)

I’ll have a look ASAP. Thanks for providing a reproducer!