Unable to integrated with angular 8 using your documentation

I am unable to integrate the pdf viewer in angular 8 as per the documentation, please provide me some other documentation or sample guide.

Hi there,

Thank you for reaching out to pdf.js express forums,

Here is a general documentation page for Angular integration: Angular PDF.js Viewer: Annotate, Form Fill, Sign | PDF.js Express

Could you please try following the angular sample repository here:

Best regards,
Kevin Kim

Thanks for the reply.
Currently i am getting error of pdf" file not supported but my path is correct also the extension.
Also i have a question, is there any cdn url that we can pass to the path so we don’t have to rely on folder path.

Getting this type of error.

image
This is the code.

Thank you for your response,

Could you also please share the PDF?
Alternatively, you could try not setting the initialDoc attribute and then load the document as WebViewer is instantiated:

Here, you can throw in the URL instead of a local file path or blob

Best regards,
Kevin Kim

I tried this and the extension error is done but there is no content on the viewer, it’s showing only blank viewer.

Thank you for your response,

Could you please share the URL of the PDF? Are you also getting any errors in the console or failed network requests?

Best regards,
Kevin Kim

Thanks for the response.
This is the url i am using for pdf https://www.orimi.com/pdf-test.pdf and there is my code, please suggest me changes if needed.

image
Please check this one also.
Thank you

Hi there,

Thank you for the link and screenshot,

It looks like accessing the link from our demo shows a CORS error:


You can find general information about CORS here: Apryse Documentation | Documentation

In addition, the screenshot shows you are behind in the express build, we are currently on 8.7.3, could you also please try updating and see if you can reproduce the issue?

Best regards,
Kevin Kim

Thanks for the response,
I tried with the local pdf also but it’s showing the same(blank viewer), also i want to inform you that i am using angular8 and i think there is no updates available for pdf express in that.
Please provide me some other solution through which i can implement to view pdf in angular8.
Thank you

Hi there,

When I use the above Angular pdf.js express GitHub sample, please note that pdf.js express is in version 6.2.1.

Please update this line 8.7.3

Afterwards, you may need to try a different PDF that does not have a CORS issue or use a CORS browser extension for testing:

If you are still having issues, could you please provide a minimal runnable sample project to reproduce your issue?

Best regards,
Kevin Kim

Thanks for the response,
image
The version is already 8.7.3, and i am already using the CROS browser extension.
Can you please share your current code ?

Hi there,

This is the WebViewer code that was used in the Angular GitHub sample:

WebViewer({
  path: '../lib',
  initialDoc: '../files/webviewer-demo-annotated.pdf'
}, this.viewer.nativeElement).then(instance => {
  this.wvInstance = instance;
  const { docViewer, annotationManager } = instance;

  docViewer.on('documentLoaded', () => {
    console.log('documentLoaded');
  })

  // or from the docViewer instance
  docViewer.on('annotationsLoaded', () => {
    console.log('annotations loaded');
  });

  document.getElementById('sample-button').addEventListener('click', async () => {
    console.log('button clicked');
    instance.UI.loadDocument('https://www.orimi.com/pdf-test.pdf');
  })
})

Note that I bind a button element with the loadDocument method.

Best regards,
Kevin Kim

Thanks for the response,
I want to clarify one thing i.e., is pdf-js express supports epub file to render ?

Is there any way to remove path: ‘…/lib’, because it occupying space in production.

Hi there,

Please note that pdf.js express is for PDF files only and will not be able to support epub files.

We have a guide on loading the lib folder from another domain:

Best regards,
Kevin Kim