Exibir PDF usando uma chamada AJAX

Eu estou tentando exibir um PDF (que é criado no lado do servidor e passar para o lado do cliente como um stream da web) através de uma chamada AJAX. Meu código é dado abaixo:

jQuery.ajax({ type: "POST", processData: false, url: "aaaa.p?name=pdf", data: inputxml, contentType: "application/xml; charset=utf-8", success: function(data) { // here the data is the PDF stream i'm getting from the server side. } }); 

O ‘inputxml’ contém parâmetros de input para o servidor para criar o PDF. e os ‘dados’ na function de sucesso contendo stream PDF. Existe alguma maneira de abrir o arquivo PDF no navegador dentro da function de sucesso da chamada AJAX sem fazer qualquer submissão de página? No lado do servidor, o PDF também não é gerado fisicamente. Aprecio muito sua ajuda ….

Por que você carrega via AJAX? Por que você não carrega em um IFRAME que você gera quando você precisa? O plug-in de navegadores padrão irá exibi-lo e, em seguida, dentro desse Iframe.

 $('#link').click(function(e) { e.preventDefault(); // if you have a URL in the link jQuery.ajax({ type: "POST", processData: false, url: "aaaa.p?name=pdf", data: inputxml, contentType: "application/xml; charset=utf-8", success: function(data) { var iframe = $(' 

Aqui está a minha maneira de lidar com esse problema. É baseado na linha 50 deste arquivo pdfmake ( https://github.com/bpampuch/pdfmake/blob/master/src/browser-extensions/pdfMake.js ).

  1. supondo que você tem um stream de pdf eu convertê-lo para base64 e ecoá-lo de volta para o meu AJAX:

     $pdfString = $mpdf->Output('', 'S'); $pdfBase64 = base64_encode($pdfString); echo 'data:application/pdf;base64,' . $pdfBase64; 
  2. Aqui está o meu código AJAX. Ao receber dados, abre uma nova janela e substitui o URL por dados endodados base64:

     var ajaxRequest = $.ajax({ url: "php/generate-pdf/print-control.php", data: '', cache: false, contentType: 'application/json', processData: false, type: 'POST' }); $.when(ajaxRequest).done(function (ajaxValue) { var win = window.open('', '_blank'); win.location.href = ajaxValue; }); 

    A desvantagem desse método é que você obtém uma string base64 na barra de endereço.

Você pode gerar uma URL temporária para acessar o arquivo PDF armazenado no servidor, em vez de enviá-lo de volta à chamada AJAX. Apenas passe o URL gerado de volta para o cliente. Então, quando você receber a URL, você poderia, por exemplo, fazer um window.location = para redirect o navegador para o download.

Certifique-se de que os headers corretos estão definidos para o arquivo gerado ( Content-Disposition: attachment etc.), e todos devem estar bem.

Edit: Embora você provavelmente poderia apenas usar um link regular (não-JavaScript) para gerar e baixar o arquivo. Mas fazer isso via AJAX permite que você mostre algumas animações específicas, etc., para o usuário enquanto o arquivo está sendo gerado.

Para quem se depara com isso. Aqui está um exemplo usando axios

  1. responseType deve ser ‘arrayBuffer’
  2. criar um object de blob a partir da resposta
  3. crie uma “URL de object” a partir do blob que você pode carregar no iframe

      axios({ url: `path/to/pdf`, method: "GET", responseType: 'arraybuffer' }).then((response) => { let blob = new Blob([response.data], { type: response.headers['content-type'] } ); let url = window.URL.createObjectURL(blob); $('#frame').attr('src',url); });