Cómo mostrar una secuencia de PDF en un navegador usando JavaScript

Question

Estoy accediendo a un servicio web WCF existente (que devuelve un PDF como una secuencia de bytes) utilizando los métodos ajax de jquery.

Cuando finaliza la llamada al servicio, termino con una variable javascript que contiene un PDF (la variable tiene los datos binarios, comenzando "% PDF-1.4 ...").

Me gustaría mostrar este PDF en una nueva ventana del navegador, pero estoy teniendo dificultades para lograrlo.

Mi investigación hasta la fecha demuestra que yo podría ser capaz de lograr lo que quiero utilizando medios informáticos: uri, por lo que mi código que se llama cuando la llamada ajax completa es la siguiente:

function GotPDF(data) 
{ 
    // Here, data contains "%PDF-1.4 ..." etc. 
    var datauri = 'data:application/pdf;base64,' + Base64.encode(data); 
    var win = window.open("", "Your PDF", "width=1024,height=768,resizable=yes,scrollbars=yes,toolbar=no,location=no,directories=no,status=no,menubar=no,copyhistory=no"); 
    win.document.location.href = datauri; 
} 

Esto provoca una nueva ventana del navegador para abrir, pero el contenido está en blanco.

Curiosamente, si apunto mi navegador (IE9) a un archivo existente en mi disco local usando un archivo: uri, como file: // c: /tmp/example.pdf, entonces obtengo el mismo resultado , es decir, una ventana en blanco.

¿Hay alguna manera de que pueda visualizar esta información de PDF?

Answer 1

El código que escribió no muestra nada, simplemente abra una ventana en blanco (location.href es un hash para el historial de navegación, no el contenido de la página).

Para visualizar un archivo PDF que tiene, al menos, las siguientes opciones:

× Insertar el visor de PDF dentro de una etiqueta o embedobject. Puede que no sea lo más sencillo que pueda imaginar, eche un vistazo a this post para ver el código de muestra. En resumen, debe ser algo como esto:

<object data="your_url_to_pdf" type="application/pdf"> 
    <embed src="your_url_to_pdf" type="application/pdf" /> 
</object> 

Eso es código básico pero sugiero que seguir lo que digo en el post relacionado si necesita una mayor compatibilidad entre navegadores.

× Descargar el archivo al equipo local (añada la URL completa de su método de servicio web que produce el archivo, no se olvide de añadir el buen Content-Disposition en la cabecera).

× Abra el archivo en una nueva ventana del navegador. Cree una etiqueta normala como señala un archivo PDF en línea que desea mostrar en una nueva ventana. Cambie el href al javascript:functionName y en esa función genere el URI que usará para llamar al método del servicio web.

Hagas lo que hagas, no olvides configurar el tipo MIME adecuado en tu respuesta; además, tu método no debe devolver una secuencia de bytes (incluso si está codificada) sino una respuesta válida para tu navegador web.

Answer 2

Si está utilizando <embed> o <object> etiqueta para mostrar un archivo de streaming PDF (u otros tipos de archivos) desde un servidor como en:

<object data="SomeServlet?do=get_doc&id=6" type="application/pdf" width="800" height="400"> 

asegúrese de que el servidor envía el correcto valor http content-disposition, que a su este caso sería inline.