CODEWITHSUNDEEP
javascriptangularjspdftron
jedgard
jedgard

Reputation: 868

Angular JS with PDFTron

I am trying to get a blob as a URL but i get an error on this line :

xhr.send()

The error message is angular.js:13920 Error: Failed to execute 'send' on 'XMLHttpRequest': The object's state must be OPENED.

But in the code I am using xhr.open('GET', blobValue) as shown in my code here

                if(someBlobValue){
                    var viewerElement = $document[0].getElementById('viewer');
                    var myWebViewer = new PDFTron.WebViewer({
                        path: 'lib',
                        pdftronServer: 'https://demo.pdftron.com' // remove
                    }, viewerElement);

                    var xhr = new XMLHttpRequest;
                    xhr.responseType = 'blob';

                    xhr.onload = function() {
                        var recoveredBlob = xhr.response;

                        var reader = new FileReader;

                        reader.readAsDataURL(recoveredBlob);
                    };

                    xhr.open('GET', someBlobValue);
                    xhr.setRequestHeader('Content-type', 'application/pdf');
                    xhr.send(); //error here although its open?
                    //var file = new File([newValue], 'somefile.pdf');
                    myWebViewer.loadDocument(xhr.response, { filename: 'somefile.pdf'});

Currently i have the document as a blob but i am trying to load it to pdftron library and unfortunately i dont seem to find the myWebViewer.getInstance().loadLocalFile method in the DOM (its undefined).

Would appreciate any pointers as its the first time trying to use pdftron in the angularjs app.

NOTE : This is inside a directive.

Upvotes: 1

Views: 893

Answers (2)

S. Patel
S. Patel

Reputation: 172

There is nothing wrong in your code logically,

  • You just forgot to instantiate the XHR object over here var xhr = new XMLHttpRequest;.
  • You can correct it by doing this var xhr = new XMLHttpRequest();

Upvotes: 1

Ryan
Ryan

Reputation: 2570

You need to wait for the DOM element containing WebViewer to trigger the ready event, for the ReaderControl instance, returned from getInstance(), to be defined.

For example:

$(viewerElement).on('ready', function() {
  myWebViewer.getInstance().loadLocalFile(someBlobValue);
});

Upvotes: 1

Related Questions