Integrasi SDK Web

Gunakan @spreeai/web-sdk untuk kedai web tersuai atau tanpa kepala.

Contoh-contoh ini menyasarkan yang diterbitkan v3.0.0 pakej. Hubungi init() sekali dan jaga hasil yang boleh dibatalkan. Rakan kongsi diselesaikan daripada clientId; tidak lulus partnerId ke v3 init(). Penyepaduan v2 sedia ada harus mengikut panduan naik taraf rasmi sebelum menukar versi.

Pasang

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

Sertakan helaian gaya SDK yang didokumenkan untuk versi SDK yang dipasang.

Mulakan dan buat

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() pulangan null apabila pengesahan gagal. Jaga semua panggilan pemaparan.

Saiz

v3.0.0 mendedahkan saiz dalam pengalaman percubaan, bukannya yang berasingan sdk.renderSizingButton() kaedah. Untuk pakaian dengan data saiz yang diluluskan, dayakan aliran pada butang cuba pakai:

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

Dayakan saiz hanya selepas data pakaian dan konfigurasi rakan kongsi sedia.

Peristiwa

SDK awam mendokumentasikan panggilan balik pihak klien untuk butang Cuba-Aktif dan tindakan tambah ke troli. Sambungkan panggilan balik ke lapisan analitik dan troli sedia ada etalase. Jangan letakkan imejan pelanggan, kelayakan atau data peribadi yang tidak perlu dalam muatan analitik.

Panduan pengeluaran

Mulakan sekali setiap halaman.
Render hanya untuk pakaian yang layak.
Lulus pengecam katalog yang stabil.
Simpan rahsia pelanggan daripada kod penyemak imbas.
Uji perubahan varian dan peralihan laluan dalam aplikasi satu halaman.
Kekalkan fokus papan kekunci dan label yang boleh diakses untuk titik masuk.
Sahkan pemuatan, kegagalan dan keadaan tidak tersedia.
Pantau prestasi halaman produk sebelum dan selepas mendayakan penyepaduan.