How to open a file using JavaScript?

Question

I have a servlet that write a pdf file as a ByteArrayOutputStream to the servlet's output stream. If I open the servlet URL the browser opens the file. But if occur an error on the servlet, the browser opens an empty pdf with an error message. Sending an error through the ServletResponse the browser opens the default error page.

I want to send an error message without redirecting to an error page or opening an invalid pdf file.

I tried:

new Ajax.Request('/pdfservlet', {            
        onSuccess: function(response) {
            docWindow = window.open('','title');
            docWindow.document.open('application/pdf');
            docWindow.document.write(response);
            docWindow.document.close();
        },
        onFailure: function(response) {
            alert(response);
        }
    });

But, onSuccess opens a page with [object object]

How can I open a PDF file using JavaScript?

Answer 1

You could try a "two-pass" approach. You use the Ajax to call the servlet ( and if it generates a PDF on the fly, have it cache it ). If it succeeds, redirect the user to the servlet with a parameter to load the cached PDF.

There are other options, but it depends on how you are using PDFs.

My $0.02..

Answer 2

Note: I'm assuming you're using the Prototype framework from the Ajax.Request call.

The response object isn't meant to be written directly, it does however, have the responseText property which should contain the returned PDF.

Have you tried:

new Ajax.Request('/pdfservlet', {            
        onSuccess: function(response) {
            docWindow = window.open('','title');
            docWindow.document.open('application/pdf');
            document.write(response.responseText);
            docWindow.document.close();
        },
        onFailure: function(response) {
            alert(response);
        }
    });

(Notice the added .responseText)

Edit: Okay, so that didn't work... Try something like this:

new Ajax.Request('/pdfservlet', {            
        onSuccess: function(response) {
            window.open('/pdfservlet');
        },
        onFailure: function(response) {
            alert(response);
        }
    });

What this will do is create the ajax request, and if successful open it in a new window. Opening the new window should be fast and not actually require requesting the PDF again since the browser should have cached it during the Ajax.Request call.

Answer 3

Since it appears you are sending your PDFs as "inline" as opposed to "attachment" you could put the URL of the PDF in a dynamically created Iframe and then attach that Iframe to an overlay. That would work.

-JP

Answer 4

But if occur an error on the servlet, the browser opens an empty pdf with an error message.

Seems to me it would be better to try to fix this at the server end than all this fragile fiddling about with AJAX and caches. Why is a servlet error still setting the ‘Content-Type: application/pdf’ header with its error message? Check the order of sending things in the servlet; don't send the ‘Content-Type’ until you've created the PDF successfully and have it ready to return.