Dokumentation

SDK 2.0 · EINBINDUNG

Warenkorb & Veranstaltungen

Verbinden Sie die beiden dokumentierten Rückrufe mit Ihrer Storefront und Ihren Analysen.

Unterstützte Rückrufe

RückrufWenn es feuertSchlüsselnutzlast
onTryOnButtonClickBeim Klicken auf die Schaltfläche, bevor das Dialogfeld geöffnet wird.name
onAddToCartClickedWenn das Erlebnis eine Add-to-Cart-Nachricht postet; Aktivieren Sie zuerst „In den Warenkorb legen“.name, garments, setIsLoading, closePopUp, onError

Behandeln Sie eine Warenkorbanfrage

TypeScript
import { init } from "@spreeai/web-sdk";
import "@spreeai/web-sdk/dist/web-sdk.css";

const sdk = await init({ clientId: "YOUR_ISSUED_CLIENT_ID" });
if (sdk) {
  await sdk.renderTryOnButton({
    elementId: "spreeai-try-on",
    garments: [{ garmentId: "YOUR_READY_GARMENT_ID" }],
    enableAddToCart: true,
    events: {
      onTryOnButtonClick: ({ name }) => {
        // Forward this non-sensitive event to your analytics layer.
        console.info(name);
      },
      onAddToCartClicked: async ({
        garments, setIsLoading, closePopUp, onError,
      }) => {
        setIsLoading(true);
        try {
          // Implement this endpoint in YOUR storefront backend.
          // Validate and map these garment IDs to your own cart variants.
          const response = await fetch("/api/cart/from-spreeai", {
            method: "POST",
            headers: { "Content-Type": "application/json" },
            body: JSON.stringify({ garments }),
          });
          if (!response.ok) throw new Error("Cart request failed");
          closePopUp();
        } catch {
          onError("Could not add to bag. Please try again.");
        } finally {
          setIsLoading(false);
        }
      },
    },
  });
}

Messen Sie die richtige Aktion

Ein Rückruf per Knopfdruck misst die Absicht, eine Anprobe zu eröffnen; Es ist kein Beweis dafür, dass eine Anprobe abgeschlossen wurde oder ein Kauf stattgefunden hat. Nutzen Sie Ihre genehmigte Analyseintegration für nachgelagerte Ergebnisse. Erfinden Sie keine Abschlussrückrufe oder Server-Webhooks, die in der veröffentlichten API fehlen.

Abnahmeprüfungen

  • Bei einem erfolgreichen Warenkorbvorgang werden das gewünschte Produkt, die gewünschte Variante und die gewünschte Menge hinzugefügt.
  • Eine fehlgeschlagene Anfrage hält den Käufer auf dem Laufenden und löscht den Ladestatus.
  • Doppelte Klicks führen nicht zu unbeabsichtigten doppelten Mutationen in Ihrem eigenen Handler.
  • Analysen enthalten nur Ereignismetadaten, ohne Kundenbilder, Token oder unnötige persönliche Daten.
Quellenangaben

Durchsuchen Sie Seitentitel und Inhalte. Escape schließt die Suche.

Wählen Sie Ihre Sprache.