Impressão Eficiente de PDFs em JavaScript

Imprimir PDFs diretamente de um navegador web usando JavaScript não é simples devido a inconsistências entre navegadores e considerações de segurança. No entanto, várias técnicas podem acionar efetivamente o diálogo de impressão do navegador para PDFs. Este artigo explora dois métodos populares: usar um iframe e utilizar a biblioteca Print.js.

Sumário

• Imprimindo PDFs com a Tag iframe
• Imprimindo PDFs com a Biblioteca Print.js
• Escolhendo o Método Certo

Imprimindo PDFs com a Tag iframe

Esta abordagem é simples, não requerendo bibliotecas externas. Ela insere o PDF em um iframe e, em seguida, aciona a impressão do contexto do iframe.

Implementação:

1. Inserir o PDF: Use uma tag <iframe>, definindo seu atributo src para a URL do PDF e ocultando-o usando CSS:

<iframe id="pdf-iframe" src="seu-arquivo-pdf.pdf" style="display: none;"></iframe>

2. Acionar a Impressão: Use JavaScript para acessar a janela de conteúdo do iframe e chamar seu método print():

function printPdf() {
  const iframe = document.getElementById('pdf-iframe');
  if (iframe.contentWindow) { // Verifica se contentWindow existe para evitar erros
    iframe.contentWindow.focus(); // Garante que o iframe esteja focado antes da impressão
    iframe.contentWindow.print();
  } else {
    console.error("Erro: Não foi possível acessar a janela de conteúdo do iframe.");
  }
}

3. Adicionar um Botão de Impressão: Crie um botão que chama printPdf():

<button onclick="printPdf()">Imprimir PDF</button>

Limitações:

• Compatibilidade com o Navegador: A confiabilidade varia entre navegadores. Alguns podem exigir interação do usuário ou permissões específicas.
• Controle Limitado: Controle mínimo sobre intervalos de páginas ou configurações de impressão.
• Segurança: Incorporar PDFs diretamente pode representar riscos de segurança, dependendo da origem do PDF.

Imprimindo PDFs com a Biblioteca Print.js

Print.js oferece uma solução mais robusta e rica em recursos, lidando com inconsistências entre navegadores e fornecendo melhor controle. É uma biblioteca leve que se integra facilmente ao seu projeto.

Implementação:

1. Incluir Print.js: Adicione a biblioteca Print.js ao seu HTML usando um CDN:

<script src="https://cdnjs.cloudflare.com/ajax/libs/print.js/1.6.2/print.min.js"></script>

2. Acionar a Impressão: Use a função printJS() do Print.js:

function printPdf() {
  printJS({
    printable: 'seu-arquivo-pdf.pdf',
    type: 'pdf',
  });
}

3. Adicionar um Botão de Impressão (igual ao anterior):

<button onclick="printPdf()">Imprimir PDF</button>

Vantagens:

• Compatibilidade Aprimorada com o Navegador: Trata efetivamente as diferenças entre navegadores.
• Mais Controle: Oferece algumas opções de personalização em comparação com o método iframe.
• Mais Fácil de Usar: Uma API mais simples e intuitiva.

Escolhendo o Método Certo

O método iframe é mais simples, mas menos confiável e oferece menos controle. Print.js oferece uma solução mais robusta, rica em recursos e fácil de usar, mas requer a adição de uma biblioteca externa. A melhor escolha depende das necessidades do seu projeto, priorizando fatores como facilidade de implementação, controle necessário e compatibilidade com o navegador.