Devoluciones de llamada admitidas
| Devolución de llamada | cuando dispara | Carga útil clave |
|---|---|---|
onTryOnButtonClick | Al hacer clic en el botón, antes de que se abra el cuadro de diálogo. | name |
onAddToCartClicked | Cuando la experiencia publica un mensaje de agregar al carrito; habilite agregar al carrito primero. | name, garments, setIsLoading, closePopUp, onError |
Manejar una solicitud de carrito
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);
}
},
},
});
}Mida la acción correcta
Una devolución de llamada al hacer clic en un botón mide la intención de abrir la prueba; no es prueba de que se haya completado una prueba o de que se haya realizado una compra. Utilice su integración de análisis aprobada para obtener resultados posteriores. No invente devoluciones de llamada de finalización ni webhooks de servidor que no estén presentes en la API publicada.
controles de aceptación
- Una operación exitosa del carrito agrega el producto, la variante y la cantidad deseados.
- Una solicitud fallida mantiene al comprador informado y borra el estado de carga.
- Los clics duplicados no crean mutaciones duplicadas no deseadas en su propio controlador.
- Los análisis contienen únicamente metadatos de eventos, sin imágenes de clientes, tokens ni datos personales innecesarios.