Cannot read property 'firstElementChild' of null

vikramTungsten commented 7 years ago

I am trying to embedded pdf on my html page using pdf.js, with the help of pdf viewer blog,I have included pdf.js and pdf.worker.js in my html file, but when I open the page, nothing is embedded and I am getting below error. Cannot read property firstElementChild of null

Please help me in this. Thanks!

HTML Code:

<body>  
<div class="pdfjs">
</div> 
<script src="{% static 'pdf.js-viewer/pdf.js'%}"></script>
<script src="{% static 'pdf.js-viewer/pdf.worker.js'%}"></script> 

<script type="text/javascript">
      PDFJS.webViewerLoad('http://url/mypdf.pdf');
</script>
</body>

Checkout below error:

Uncaught (in promise) TypeError: Cannot read property 'firstElementChild' of null at Object.PDFViewer (http://url/pdf.js:17939:52) at http://url/pdf.js:12985:21 at Object._initializeViewerComponents (http://url/pdf.js:12973:10) at http://url/pdf.js:12884:16PDFViewer

pierregaboriaud commented 7 years ago

Any news ?

micheg commented 6 years ago

Man you miss a focal point: "Include viewer.html using SSI or your favorite templating system." SSI means server side including, the content of viewer.html should be in the page before calling window.PDFJS.webViewerLoad. You don't need SSI, you can use jquery too. ex:

<script>
  var file = 'some-document.pdf'; 
  // waiting for page load, loading the content of viewer.html inside pdfjs THEN load file
  $(function()
  {
    $('div.pdfjs').load("bower_components/pdf.js-viewer/viewer.html", function()
    {
      window.PDFJS.webViewerLoad();
      window.PDFViewerApplication.open(file);     
    });
  });
</script>

legalthings / pdf.js-viewer

Cannot read property 'firstElementChild' of null #23