Upload de Imagens

Como enviar e gerenciar imagens de produtos via Office API.

Como Funciona

A Office API aceita imagens codificadas em base64 nos campos base64Images e filenames. As imagens são processadas, otimizadas e armazenadas automaticamente pela plataforma.

Formatos Suportados

Criar Produto com Imagens

Envie imagens no momento da criação do produto:

import { readFileSync } from 'fs';
import { basename } from 'path';

function imageToBase64(filepath) {
  const buffer = readFileSync(filepath);
  const extension = filepath.split('.').pop().toLowerCase();
  const mimeTypes = { jpg: 'jpeg', jpeg: 'jpeg', png: 'png', webp: 'webp' };
  const mime = mimeTypes[extension] || 'jpeg';
  return `data:image/${mime};base64,${buffer.toString('base64')}`;
}

const imagePaths = ['./photos/front.jpg', './photos/back.jpg', './photos/detail.jpg'];

const base64Images = imagePaths.map(imageToBase64);
const filenames = imagePaths.map(p => basename(p));

const { insertProduct } = await officeApi(`
  mutation($input: OfficeApiInsertProductInput!) {
    insertProduct(input: $input) {
      success
      productId
      product {
        id
        title
        images { url }
      }
    }
  }
`, {
  input: {
    title: 'Camiseta com Estampa',
    description: 'Camiseta com estampa exclusiva',
    price: 59.90,
    availableQuantity: 50,
    isActive: true,
    category: 'product',
    menu: [],
    base64Images,
    filenames
  }
});

console.log('Imagens:', insertProduct.product.images);

Atualizar Imagens de Produto Existente

Ao atualizar um produto, envie todas as imagens desejadas (as imagens anteriores serão substituídas):

const { updateProduct } = await officeApi(`
  mutation($input: OfficeApiUpdateProductInput!) {
    updateProduct(input: $input) {
      success
      product {
        id
        images { url }
      }
    }
  }
`, {
  input: {
    id: 'UHJvZHVjdDo2MTIz...',
    base64Images: [imageToBase64('./nova-foto.jpg')],
    filenames: ['nova-foto.jpg']
  }
});

Imagens via URL (alternativa)

Se suas imagens já estão hospedadas em um servidor, você pode converter URLs para base64 antes de enviar:

async function urlToBase64(imageUrl) {
  const response = await fetch(imageUrl);
  const buffer = Buffer.from(await response.arrayBuffer());
  const contentType = response.headers.get('content-type') || 'image/jpeg';
  return `data:${contentType};base64,${buffer.toString('base64')}`;
}

const imageUrl = 'https://example.com/photo.jpg';
const base64 = await urlToBase64(imageUrl);

// Use no insertProduct ou updateProduct
const input = {
  title: 'Produto Importado',
  base64Images: [base64],
  filenames: ['photo.jpg'],
  // ... demais campos
};

Limites

• Tamanho máximo por imagem: 10MB (antes da codificação base64)
• Número máximo de imagens por produto: depende do plano da loja
• Imagens são automaticamente otimizadas (compressão, resize)
• CDN: imagens são servidas via CDN para performance máxima