Gerando Etiquetas de Envio e Códigos de Barras via API — TongoRender Blog
Voltar ao Blog
tutorialsshippingbarcodeecommerce

Gerando Etiquetas de Envio e Códigos de Barras via API

Aprenda a gerar etiquetas de envio com códigos de barras usando templates HTML e uma API de PDF. Cobre geração de códigos de barras, design de etiquetas e integração com e-commerce.

TongoRender Team22 de janeiro de 202610 min

Etiquetas de envio são a espinha dorsal da logística de e-commerce. Cada pacote precisa de uma etiqueta impressa com o endereço de destino, endereço de retorno, código de barras de rastreamento e informações da transportadora. Embora a maioria das transportadoras forneça sua própria geração de etiquetas, muitas empresas precisam de etiquetas personalizadas — para experiências de unboxing de marca, configurações multi-transportadora, gerenciamento de armazém ou envios internacionais com declarações alfandegárias.

Anatomia de uma Etiqueta de Envio

  • Informações do remetente — Nome da empresa, endereço de retorno
  • Informações do destinatário — Nome, endereço, telefone
  • Código de barras de rastreamento — Code 128, Code 39 ou QR code
  • Tipo de serviço — Expresso, SEDEX, PAC, etc.
  • Peso e dimensões — Peso e tamanho do pacote

Gerando Códigos de Barras em HTML

const bwipjs = require('bwip-js');

async function generateBarcode(text, type = 'code128') {
  const png = await bwipjs.toBuffer({
    bcid: type,
    text: text,
    scale: 3,
    height: 15,
    includetext: true,
    textxalign: 'center',
  });
  return `data:image/png;base64,${png.toString('base64')}`;
}

const trackingBarcode = await generateBarcode('BR999AA10123456784', 'code128');
const qrCode = await generateBarcode('https://rastreio.exemplo.com/BR999AA10123456784', 'qrcode');

Design do Template de Etiqueta

Etiquetas de envio geralmente têm 4x6 polegadas (101.6mm x 152.4mm):

function shippingLabelHTML(order, barcodes) {
  return `
  <!DOCTYPE html>
  <html>
  <head>
    <style>
      * { margin: 0; padding: 0; box-sizing: border-box; }
      body { width: 101.6mm; height: 152.4mm; font-family: Arial, sans-serif; font-size: 10pt; }
      .label { width: 100%; height: 100%; border: 2px solid #000; padding: 3mm; display: flex; flex-direction: column; }
      .section { border-bottom: 1px solid #000; padding: 2mm 0; }
      .from { font-size: 8pt; color: #333; }
      .to { font-size: 14pt; font-weight: bold; padding: 3mm 0; }
      .service-badge { display: inline-block; background: #000; color: #fff; padding: 2px 8px; font-weight: bold; }
      .barcode-section { text-align: center; padding: 3mm 0; }
      .barcode-section img { max-width: 100%; }
      .tracking-number { font-family: monospace; font-size: 12pt; text-align: center; }
    </style>
  </head>
  <body>
    <div class="label">
      <div class="section from">
        <strong>DE:</strong> ${order.sender.name}<br>
        ${order.sender.address}<br>
        ${order.sender.city}, ${order.sender.state} — CEP ${order.sender.zip}
      </div>
      <div class="section">
        <span class="service-badge">${order.serviceType}</span>
        <div class="to">
          <div>${order.recipient.name}</div>
          <div>${order.recipient.address}</div>
          <div>${order.recipient.city}, ${order.recipient.state} — CEP ${order.recipient.zip}</div>
        </div>
      </div>
      <div class="section barcode-section">
        <img src="${barcodes.tracking}" alt="Código de barras de rastreamento">
        <div class="tracking-number">${order.trackingNumber}</div>
      </div>
      <div class="section">
        <span>Peso: ${order.weight} kg</span> |
        <span>Dimensões: ${order.dimensions}</span>
      </div>
    </div>
  </body>
  </html>`;
}

Gerando o PDF da Etiqueta

async function generateShippingLabel(order) {
  const barcodes = {
    tracking: await generateBarcode(order.trackingNumber, 'code128'),
  };
  const html = shippingLabelHTML(order, barcodes);

  const response = await fetch('https://api.tongorender.io/v1/pdf', {
    method: 'POST',
    headers: {
      'Content-Type': 'application/json',
      'X-API-Key': process.env.TONGORENDER_API_KEY,
    },
    body: JSON.stringify({
      html,
      width: '101.6mm',
      height: '152.4mm',
      margin: { top: '0mm', bottom: '0mm', left: '0mm', right: '0mm' },
      printBackground: true,
    }),
  });
  return Buffer.from(await response.arrayBuffer());
}

Impressão em Lote de Etiquetas

const PDFMerger = require('pdf-merger-js');

async function batchGenerateLabels(orders) {
  const merger = new PDFMerger();
  for (const order of orders) {
    const labelPdf = await generateShippingLabel(order);
    await merger.add(labelPdf);
  }
  const mergedPdf = await merger.saveAsBuffer();
  fs.writeFileSync('etiquetas-lote.pdf', mergedPdf);
  console.log(`Geradas ${orders.length} etiquetas`);
}

Dicas para Etiquetas em Produção

  • Use dimensões de impressora térmica — A maioria das impressoras térmicas usa etiquetas 4x6 polegadas. Configure o tamanho da página do PDF para corresponder exatamente.
  • Teste a leitura do código de barras — Imprima etiquetas de amostra e escaneie com um leitor de código de barras antes de ir ao ar.
  • Lide com endereços internacionais — Formatos de endereço variam por país.
  • Inclua informações alfandegárias — Envios internacionais exigem declarações com descrições de itens, valores e códigos NCM.
  • Renderização em alta DPI — Códigos de barras precisam de bordas nítidas. Gere-os com no mínimo 300 DPI.

O suporte a tamanho de página personalizado do TongoRender o torna perfeito para etiquetas de envio. Defina dimensões exatas, margens zero e fundos impressos para etiquetas prontas para impressão térmica.

Gere etiquetas de envio com o TongoRender — 100 renderizações gratuitas por mês, sem necessidade de cartão de crédito.

Compartilhe este artigoCompartilhar no Twitter