Entwickeln · WooCommerce

Ein WooCommerce-Try-on-Plugin entwickeln

In aller Kürze

Ein WooCommerce-Plugin ruft die Photta-API über einfaches HTTP aus einem WP-Cron-Event auf, pollt den Job beim folgenden Tick und importiert das fertige Bild in die Mediathek.

  • Credits: 5 Credits bei 2K · 6 Credits bei 4K
  • Typische Dauer: 1.5–4 min
  • Verarbeitung: asynchron, Polling

Jeder Zahlenwert auf dieser Seite stammt aus der Photta-API-Dokumentation · geprüft

Kein PHP-SDK erforderlich. WP-Cron übermittelt den Job, der nächste Tick pollt ihn, und WP-CLI importiert das fertige Bild in die Mediathek.

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')

Funktionsweise

Ein Cron-Tick, ein Poll und ein Medien-Import

Plugin planen, Jobs planen, übermitteln, beim nächsten Tick pollen, importieren.

  1. Schritt 1

    Das Plugin planen

    Eine Queue-Tabelle, ein Cron-Hook, eine Einstellungsseite für den Key. Die Generierung erfolgt nie während eines Page-Requests, sodass kein Käufer durch blockierende Prozesse beeinträchtigt wird.

  2. Schritt 2

    Einen Photta-API-Key abrufen

    Lesen Sie ihn über Umgebungsvariablen in der wp-config.php aus, statt ihn in der Options-Tabelle zu speichern – so enthält ein Datenbankexport keine Zugangsdaten.

  3. Schritt 3

    Das Cron-Event planen

    Registrieren Sie einen wiederkehrenden Hook und verarbeiten Sie pro Durchlauf eine Handvoll Produkte aus der Queue. Eine Website mit echtem Traffic erhält regelmäßige Ticks; eine ruhige Seite benötigt einen echten System-Cron.

  4. Schritt 4

    Das Produkt übermitteln

    Senden Sie das Produktbild mit wp_remote_post – dieselbe URL, dieselben Header und derselbe JSON-Body wie im cURL-Beispiel. Speichern Sie die zurückgegebene ID in der Queue-Zeile.

  5. Schritt 5

    Beim nächsten Tick pollen

    Lesen Sie den Status für jede Zeile aus, die noch auf processing steht. Da Ticks einige Minuten auseinanderliegen, reicht in der Regel ein Poll pro Tick; kein Prozess wartet blockierend innerhalb eines Requests.

  6. Schritt 6

    Das Bild importieren

    Sobald ein Job completed ist, importieren Sie die URL in die Mediathek und verknüpfen sie mit dem Produkt. WP-CLI übernimmt den Download, sodass das Plugin die Datei niemals puffert.

Die vier Kernkomponenten des Plugins

Die Photta-Aufrufe basieren auf der API-Dokumentation; wp_remote_post akzeptiert dieselbe URL, dieselben Header und denselben 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

Häufige Fragen von Entwicklern

Häufige Fragen von WordPress-Entwicklern

Gibt es ein offizielles PHP-SDK?

Nein. Die API ist reines REST über HTTPS mit einem Bearer-Header; wp_remote_post deckt alles ab, ganz ohne zusätzliche Abhängigkeiten, die gewartet werden müssen.

Wie führe ich den Aufruf über PHP aus?

Mit wp_remote_post inklusive Authorization- und Content-Type-Headern sowie einem JSON-Body. Das cURL-Beispiel auf dieser Seite entspricht exakt derselben Anfrage, Feld für Feld.

Warum nicht direkt beim Seitenaufruf generieren?

Eine Generierung dauert länger, als ein Seitenaufruf dauern sollte. Das Rendern während eines Requests lässt Kunden warten, läuft in Timeouts und die Credits sind in jedem Fall verbraucht.

Wie viele Produkte sollten pro Durchlauf verarbeitet werden?

Verarbeiten Sie pro Tick eine kleine Menge und bauen Sie die Queue über mehrere Ticks hinweg ab. Das hält jeden Durchlauf kurz und bleibt zuverlässig innerhalb des publizierten Rate Limits.

Was geschieht mit fehlgeschlagenen Jobs?

Markieren Sie die Zeile als failed und speichern Sie den Fehlertyp aus der Antwort. Credits für fehlgeschlagene Generierungen werden automatisch erstattet, sodass ein Retry nicht doppelt berechnet wird.

Ein Plugin ohne Abhängigkeitsbaum

Bearer-Header, JSON-Body, Polling. Alles, was WordPress bereits von Haus aus mitbringt.