Snabbaste vägen
SPREEAI för utvecklare
Bygg provrummet
in i varje skärm.
Koppla samman din katalog. Forma kundresan. Introducera Always On i din butik med den integrationsväg som passar ditt team.
Välj din väg
Börja där din
handelsstack liv.
Använd Shopify för en hanterad installation, eller integrera med våra SDK:er och API:er. Välj de funktioner som ditt företag behöver och behåll ditt varumärkes shoppingupplevelse.
Anpassad webb
Webb-SDK
Kontrollera placering, styling, händelser, storlek och beteende vid lägg till i varukorgen.JavaScript + TypeScript DokumentInbyggd mobil
iOS SDK
Inkludera SPREEAI-upplevelsen i en befintlig iOS-shoppingresa.Öppna iOS-guiden DokumentInbyggd mobil
Android SDK
Integrera prova-på-funktioner i en Android-produktupplevelse med inbyggda kontroller.Öppna Android-guiden PartneråtkomstAnpassade system
Offentliga API:er
Använd den godkända API-referensen för server- och katalogarbetsflöden.Öppen API-referensMarknad
Amazon Partner Network
Kommer snart till Amazon Partner Network och andra plattformar, med fler sätt att integrera SPREEAI i din e-handelsplattform.Uppdateringar kommer att visas här förstSnabbstart för webb-SDK
Din första integration.
Autentisera en gång och rendera sedan provkörning eller storleksanpassning var som helst på sidan. Använd testuppgifter som utfärdats under onboarding och lägg aldrig till en klienthemlighet i webbläsarkod.
npm install @spreeai/web-sdk@3.0.0
# or
yarn add @spreeai/web-sdk@3.0.0import { 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,
});
}// Pass events inside renderTryOnButton's options.
await sdk?.renderTryOnButton({
elementId: "spreeai-try-on",
garments: [{ garmentId: "your-garment-id" }],
events: {
onTryOnButtonClick: (event) => {
console.info(event.name);
},
onAddToCartClicked: (event) => {
// Connect event.garments to your storefront's cart.
},
},
});Integrationsmodellen
Fyra system.
Ett kundögonblick.
Produkt-ID:n, varianter, bilder och varukontext.
Plagg går igenom bearbetnings-, gransknings- och beredskapsstadier.
Din butik begär upplevelsen för en kvalificerad produkt.
Prova, hitta en storlek, komplettera looken och gå tillbaka till kassan.
En fokuserad väg till lansering
Förbered dig. Anslut.
Gå och lev med självförtroende.
Tre milstolpar, med en praktisk checklista för varje.
- 01 · Förbered dig
En tydlig utgångspunkt.
Samordna resan, åtkomsten och katalogen.
Checklista för förberedelser
- Välj en kanal, kataloggrupp och framgångsmått.
- Bekräfta partneråtkomst, inloggningsuppgifter och behörigheter för mellanlagring.
- Tillhandahåll tydliga, SKU-anpassade plaggbilder.
- 02 · Anslut
Få det att kännas inhemskt.
Bygg in staging. Testa hela resan.
Checklista för integration
- Rendera för kvalificerade produkter och anslut varianter och varukorgsbeteende.
- Matcha upplevelsen med varumärket.
- Kontrollera mobil, dator, tillgänglighet, prestanda och felstatus.
- 03 · Lansering
Lär dig av verklig användning.
Aktivera färdiga produkter och mät.
Checklista för lansering
- Bekräfta produktens beredskap och publicera den etappvisa upplevelsen.
- Övervaka implementering, slutförande och konvertering.
- Använd resultaten för att vägleda nästa kategori eller resa.
Tillgångsbaslinje
Bra input ger ett bättre resultat.
- JPEG eller PNG
- Minst 2 000 × 2 000 pixlar
- Framifrån krävs
- Bakifrån rekommenderas
- Neutral, jämn belysning
- SKU eller stil-ID i filnamn
Utvecklarreferens
Hitta nästa
användbart svar.
Börja här
Komma igång
Förstå åtkomst, plattformar som stöds och de första besluten ditt team behöver fatta.
Officiell referens Hanterad integrationShopify introduktion
Installera appen, acceptera avtal, synkronisera kläder, anpassa knappen och gå live.
Officiell referens Webb-SDKAPI-yta
Granska initialisering, renderingsalternativ, storleksändring, anpassning och typade gränssnitt.
Officiell referens Partner-APIReferens för offentligt API
Utforska det godkända servergränssnittet som är tillgängligt för autentiserade partners.
Swagger-referens KvalitetKlädtillgångar
Förbered produktbilder och metadata som rör sig smidigt genom inmatning och granskning.
SPREEAI-guide ProduktionQA och lansering
Använd den delade webbläsaren, prestanda, tillgänglighet och checklistan för livestart.
SPREEAI-guide StödFelsökning
Lös de vanligaste problemen med autentisering, behörighet, rendering och prestanda.
SPREEAI-guide DokumentationImplementeringsguider
Bläddra bland offentliga snabbstarter, resursstandarder, checklistor för lansering och felsökningsvägledning.
Öppna dokumentationenInga matchande utvecklarresurser. Prova ”Shopify”, ”SDK”, ”assets” eller ”QA”.
Bygg för produktion
Detaljerna som skyddar
kundupplevelsen.
Säkerhet
Håll hemligheter på serversidan, använd endast utfärdade miljöer och rotera inloggningsuppgifter genom partnerarbetsflödet.
Privatliv
Begär kundbilder med tydligt samtycke och anpassa datahanteringen till er godkända integrationsplan.
Prestanda
Ladda upplevelsen där den behövs, testa riktiga enheter och övervaka regressioner på produktsidan.
Tillgänglighet
Bevara tangentbordsåtkomst, fokusordning, tillgängliga namn och en användbar sökväg när upplevelsen inte är tillgänglig.
Vanliga frågor om utvecklare
Frågor före
den första åtagandet.
Vilken integration ska vi välja?
Använd Shopify-appen för den snabbaste hanterade sökvägen, webb-SDK:n för anpassad eller headless webbplacering, de inbyggda SDK:erna för appupplevelser och den godkända API-referensen för serversidesarbetsflöden som överenskommits under onboarding.
Varifrån kommer meriterna?
SPREEAI utfärdar partner-ID och godkända inloggningsuppgifter under onboarding. Webbläsarens SDK använder ett klient-ID och partner-ID. Bädda aldrig in en klienthemlighet i frontend-kod.
Kräver Shopify-appen API-nycklar?
Det nuvarande Shopify-introduktionsflödet för appen ansluter till butiken efter de obligatoriska avtalen och prenumerationsstegen; den hanterade appen kräver inte att nycklar kopieras till installationsskärmen.
Varför visas inte knappen Prova-på?
Bekräfta att plagget har slutförts bearbetning, är aktiverat för prova-på, mappas till den aktiva produkten eller varianten och att appblocket eller SDK-behållaren finns i produktmallen.
Vilka klientevenemang är tillgängliga?
De dokumenterade SDK-återanropen täcker klick på provknappar och interaktioner med att lägga till i varukorgen. Koppla dem till ditt analyslager utan att inkludera kundbilder eller onödiga personuppgifter.
Finns server-webhooks tillgängliga?
Server-push webhooks ingår inte i den för närvarande publicerade SDK-dokumentationen. Kontrollera eventuella händelsekrav på serversidan med Partner Engineering innan du förlitar dig på dem.
Var får utvecklare hjälp?
Använd den tekniska supportvägen som tillhandahålls under introduktionen eller via e-post support@spreeai.comInkludera miljö, produkt-ID, webbläsare eller enhet, tidsstämpel och en kortfattad reproduktionsväg – skicka aldrig hemligheter.
När blir supporten för Amazon Partner Network tillgänglig?
Amazon Partner Network-integrationen är under utveckling. Den är avsiktligt markerad "Kommer snart" tills onboarding- och produktionsgränssnittet är redo för externa utvecklare.
Redo att bygga?