How to mimick the '?file=' query parameter via javaScript

[tfierens]

Hi,

How can I mimic the http://localhost/viewer.html?file=abc.pdf' via JavaScript?

I post a message via postMessage from my web app in which host an iFrame which has its source set to the viewer.html.

In the Viewer.html, I capture the message via the addEventListener but I need to load the relevant pdf file via code but I don't understand how to get it to work using the Viewer.html in order to mimic the '?file=' behaviour.

`
<script>
$(document).ready(function () {
window.addEventListener('message', function (event) {
var domain = 'http://' + document.location.hostname;
if (event.origin !== domain) return;
console.log('message received: ' + event.data, event);
var fileName = 'http://localhost/myapp/scripts/pdfjs-dist/web/' + event.data;
var pdfjsLib = window['pdfjs-dist/build/pdf'];

            console.log(pdfjsLib);
        }, false);
 </script>

`

Eventually I want to use a base64 string but I thought I'd try to figure out how the query param works and how to mimic it via code.

All the example I'm finding are using code similar to this:

var loadingTask = pdfjsLib.getDocument(url); loadingTask.promise.then(function(pdf) {...

and while pdfjsLib.getDocument seems to be setting the file, I'm not sure what to call next to 're-initialize' the viewer displayed in viewer.html.

I was hoping for something like:

`
pdfjslib.getDocument(url);
pdfjsLib.webViewerLoad();

`
or something similar.

Is there a way to set the file and then initialize the viewer?

I hope you can help.

Sorry I know this is not an issue and more a 'how to' but I thought this was probably the best place to ask.

[tfierens]

Hi,

I've actually figured it out. I don't know if this is correct or not, but it seems to work ok using the following:

var config = PDFViewerApplication.appConfig;
config.defaultUrl = fileName;
PDFViewerApplication.run(config);

If anyone has a few minutes to spare and confirm that this is ok, that would be great.

Thanks.

Next step is getting this to work hopefully in a similar way with a base64 string or an array :).

[tfierens]

Note that I've noticed a couple of problem using this method:

1. Memory leaks: The memory used by the browser keeps on increasing over and over and while it doesn't seem to go over a certain amount i.e. 280Mb/300Mb, it does start at 85Mb and even when calling the 'PDFViewerApplication.cleanup();' it does not seem to have any effect regarding releasing memory.

2. When flicking from one document to another over and over, it does a weird thing with the Zoom In, Zoom Out and the Zoom dropdown where it moves it out of the toolbar and displays it over the viewer and it remains there until I close the browser.

I've attached a screencast where you can clearly see the issue: Odd toolbar behaviour

I'll revert my code back tomorrow and see if the same happens when using the file query parameter.

[tfierens]

Please note that the toolbar does not get messed up when opening multiple documents one after the other when using the query string parameter ?file= so something must not be reset when calling the above code event though it is technically the same as what is in the webViewerLoad method which calls the 'pdfjsWebApp.PDFViewerApplication.run'.

[timvandermeij]

You have two options:

• Create a custom viewer using the viewer components (see the examples/components folder) so you can use the API: var loadingTask = pdfjsLib.getDocument(url); loadingTask.promise.then(function(pdf) {....
• Edit the default viewer and check how the default URL is set in code.

Memory leaks may happen if you don't close the file properly when reloading. Hence, it's best to reuse the logic that is already there to open and close files. Refer to:

https://github.com/mozilla/pdf.js/blob/master/web/app.js#L695