Build · WooCommerce

Crie um plugin de try-on para WooCommerce

Em uma frase

Um plugin para WooCommerce chama a API do Photta via HTTP puro a partir de um evento do WP-Cron, faz o polling do job no tick seguinte e importa a imagem finalizada para a biblioteca de mídia.

  • Credits: 5 credits em 2K · 6 credits em 4K
  • Tempo típico: 1.5–4 min
  • Processamento: assíncrono, polling

Todos os números nesta página vêm de a documentação da API da Photta · verificado

Nenhum SDK PHP é necessário. O WP-Cron envia o job, o tick seguinte faz o polling e o WP-CLI importa a imagem finalizada para a biblioteca de mídia.

RESPONSE=$(curl -s -X POST https://api.photta.app/api/v1/tryon/apparel \
  -H "Authorization: Bearer $PHOTTA_API_KEY" \
  -H "Content-Type: application/json" \
  -d '{
  "product_type": "top",
  "product_images": [
    "https://cdn.yourstore.com/products/shirt-front.jpg"
  ],
  "product_back_image": "https://cdn.yourstore.com/products/shirt-back.jpg",
  "product_category": "t_shirt",
  "mannequin_id": "mnk_f3a9b1",
  "pose_id": "pose_c2d4e5",
  "background": "https://cdn.yourstore.com/backgrounds/studio-loft.jpg",
  "lock_background": true,
  "resolution": "2K",
  "aspect_ratio": "3:4",
  "body_size": "M",
  "expression": "neutral",
  "user_instruction": "Keep the collar pattern crisp and centered."
}')
ID=$(echo "$RESPONSE" | jq -r '.data.id')

Como funciona

Um tick de cron, um poll e uma importação de mídia

Planeje o plugin, agende o trabalho, envie, faça polling no próximo tick, importe.

  1. Passo 1

    Planeje o plugin

    Uma tabela de fila, um hook de cron, uma tela de configurações para a chave. A geração nunca acontece durante o carregamento de uma página, então nenhuma ação do cliente trava por causa disso.

  2. Passo 2

    Obtenha uma chave de API do Photta

    Leia-a do ambiente no wp-config.php em vez de salvá-la na tabela de opções, garantindo que um dump do banco de dados não exponha suas credenciais.

  3. Passo 3

    Agende o evento de cron

    Registre um hook recorrente e processe um lote pequeno de produtos da fila por execução. Um site com tráfego real tem ticks frequentes; um site com pouco tráfego precisa de um cron real do sistema.

  4. Passo 4

    Envie o produto

    Envie a imagem do produto com wp_remote_post — a mesma URL, headers e body JSON do exemplo em cURL. Salve o id retornado na linha da fila.

  5. Passo 5

    Faça polling no próximo tick

    Consulte o status de cada linha que ainda estiver em processamento. Como os ticks ocorrem com minutos de intervalo, um poll por tick costuma ser suficiente; nada fica em sleep durante a requisição.

  6. Passo 6

    Importe a imagem

    Assim que o job for concluído, importe a URL para a biblioteca de mídia e vincule-a ao produto. O WP-CLI faz o download para que o plugin nunca precise carregar o arquivo em buffer.

As quatro partes móveis do plugin

As chamadas ao Photta são montadas a partir da documentação da API; wp_remote_post recebe a mesma URL, headers e body.

# wp-config.php holds the key; the plugin reads it with getenv()
# define( 'PHOTTA_API_KEY', getenv( 'PHOTTA_API_KEY' ) );
export PHOTTA_API_KEY="photta_live_xxx"
export PHOTTA_BASE_URL="https://api.photta.app/api/v1"
RESPONSE=$(curl -s -X POST https://api.photta.app/api/v1/tryon/apparel \
  -H "Authorization: Bearer $PHOTTA_API_KEY" \
  -H "Content-Type: application/json" \
  -d '{
  "product_type": "top",
  "product_images": [
    "https://cdn.yourstore.com/products/shirt-front.jpg"
  ],
  "product_back_image": "https://cdn.yourstore.com/products/shirt-back.jpg",
  "product_category": "t_shirt",
  "mannequin_id": "mnk_f3a9b1",
  "pose_id": "pose_c2d4e5",
  "background": "https://cdn.yourstore.com/backgrounds/studio-loft.jpg",
  "lock_background": true,
  "resolution": "2K",
  "aspect_ratio": "3:4",
  "body_size": "M",
  "expression": "neutral",
  "user_instruction": "Keep the collar pattern crisp and centered."
}')
ID=$(echo "$RESPONSE" | jq -r '.data.id')
# $ID is data.id from the POST response. Poll every 3 seconds until status is "completed" or "failed".
for i in $(seq 1 120); do
  RESULT=$(curl -s "https://api.photta.app/api/v1/tryon/apparel/$ID" -H "Authorization: Bearer $PHOTTA_API_KEY")
  STATUS=$(echo "$RESULT" | jq -r '.data.status')
  [ "$STATUS" = "completed" ] && break
  [ "$STATUS" = "failed" ] && echo "generation failed" && exit 1
  sleep 3
done
echo "$RESULT" | jq -r '.data.output_url'
# WP-CLI does the download, so the plugin never buffers the file itself
wp media import "$OUTPUT_URL" \
  --post_id="$PRODUCT_ID" \
  --title="Virtual try-on" \
  --featured_image

Dúvidas frequentes de desenvolvedores

Perguntas que desenvolvedores WordPress fazem

Existe um SDK PHP oficial?

Não. A API é REST puro sobre HTTPS com header de bearer, então o wp_remote_post resolve tudo sem exigir dependências extras para manter atualizadas.

Como faço a chamada em PHP?

Com wp_remote_post, incluindo os headers Authorization e Content-Type e um body JSON. O exemplo em cURL nesta página é exatamente a mesma requisição, campo por campo.

Por que não gerar durante o carregamento da página?

Uma geração leva mais tempo do que uma página deveria demorar para responder. Renderizar durante a requisição faz o comprador esperar, arrisca estourar o timeout e os credits são consumidos de qualquer forma.

Quantos produtos devem ser processados por execução?

Processe uma fatia pequena por tick e deixe a fila esvaziar ao longo das execuções. Isso mantém cada execução rápida e você bem dentro do rate limit definido.

O que acontece com jobs que falham?

Marque a linha como failed e salve o tipo de erro retornado na resposta. Os credits de uma geração com falha são estornados automaticamente, então uma nova tentativa não paga em dobro.

Um plugin sem árvore de dependências

Header Bearer, body JSON, polling. Tudo o que o WordPress já faz nativamente.