Integrace webových SDK

Použití @spreeai/web-sdk pro vlastní nebo bezhlavý webový obchod.

Tyto příklady se zaměřují na publikované v3.0.0 balíček. Zavolejte init() jednou a ochránit jeho nulovatelný výsledek. Partner je vyřešen z clientIdneprocházet partnerId do verze 3 init()Stávající integrace v2 by se měly před změnou verzí řídit oficiálním průvodcem upgradem.

Instalovat

npm install @spreeai/web-sdk@3.0.0
# or
yarn add @spreeai/web-sdk@3.0.0

Uveďte stylový list SDK zdokumentovaný pro nainstalovanou verzi SDK.

Inicializovat a vykreslit

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

// Add <div id="spreeai-try-on"></div> to the product page first.
const sdk = await init({ clientId: "your-client-id" });

if (sdk) {
  await sdk.renderTryOnButton({
    elementId: "spreeai-try-on",
    garments: [{ garmentId: "your-garment-id" }],
    enableAddToCart: true,
  });
}

init() výnosy null když selže ověření. Chraňte všechna volání renderování.

Velikost

Verze 3.0.0 umožňuje výběr velikosti v rámci zkoušení, nikoli jako samostatný prvek. sdk.renderSizingButton() metoda. U oděvu se schválenými údaji o velikosti povolte tento postup na tlačítku vyzkoušení:

await sdk?.renderTryOnButton({
  elementId: "spreeai-try-on",
  garments: [{ garmentId: "your-garment-id" }],
  enableSizingRecommendation: true,
});

Povolte změnu velikosti až po přípravě dat oděvu a konfigurace partnera.

Události

Veřejná sada SDK dokumentuje zpětná volání na straně klienta pro tlačítko Vyzkoušet a akce přidání do košíku. Propojte zpětná volání se stávajícími analytickými vrstvami a vrstvami košíku v obchodě. Nevkládejte do analytických dat obrázky zákazníků, přihlašovací údaje ani zbytečné osobní údaje.

Pokyny pro výrobu

Oficiální reference

Vyberte si jazyk.