Marktplaats
SPREEAI voor ontwikkelaars
Bouw het pasmandje
in elk scherm.
Begin met Shopify, de Web SDK of een goedgekeurde API-integratie. Deze hub brengt je team van eerste beslissing naar een getest begin.
- 04
- integratiepaden
- v2.1
- huidige Web-SDK
- 01
- lanceringschecklist
Kies je pad
Begin waar je
Commerce Stack leeft.
Kies de snelste route die bij je webshop past. Je kunt overstappen van een beheerde app naar een aangepaste SDK- of API-integratie naarmate de ervaring groeit.
LiveBinnenkort beschikbaar
Snelste pad
Shopify-app
Installeren, kledingstukken synchroniseren, aanpassen en lanceren zonder aangepaste backend.Het beste voor Shopify-etalages ↗ v2.1.0Maatwerk web
Web-sdk
Beheers plaatsing, styling, gebeurtenissen, grootte en winkelwagenfunctionaliteit.JavaScript + TypeScript ↗ DocumentenNative mobiel
iOS SDK
Breng de SPREEAI-ervaring naar een bestaande iOS-winkelreis.Open iOS-gids ↗ DocumentenNative mobiel
Android SDK
Integreer try-on in een Android-productervaring met native besturingselementen.Open Android-gids ↗ Partner-toegangMaatwerksystemen
Openbare API's
Gebruik de goedgekeurde API-referentie voor server-side en catalogusworkflows.Open API-referentie ↗Web SDK-snelstartgids
Van installatie tot
werkende knop.
Authenticeer eenmaal en geef vervolgens virtual try-on of maattabellen overal op de pagina weer. Gebruik testgegevens die tijdens de onboarding zijn verstrekt en plaats nooit een client secret in browsercode.
npm install @spreeai/web-sdk
# of
yarn add @spreeai/web-sdkimport { init } from "@spreeai/web-sdk";
const sdk = await init({
clientId: "your-client-id",
partnerId: "your-partner-id",
});
if (sdk) {
await sdk.renderTryOnButton({
elementId: "spreeai-try-on",
garments: [{ garmentId: "your-garment-id" }],
enableAddToCart: true,
});
}events: {
onTryOnButtonClick: (event) => {
analytics.track("try_on_started", event);
},
onAddToCartClicked: async (event) => {
// Maak verbinding met uw bestaande winkelmandworkflow.
},
}Het integratiemodel
Vier systemen.
Eén klantmoment.
Product-id's, varianten, afbeeldingen en merchandisingcontext.
Kledingstukken doorlopen verwerkings-, beoordelings- en gereedheidsfasen.
Uw etalage vraagt de ervaring aan voor een in aanmerking komend product.
Pas het aan, vind een maat, maak de look compleet en ga terug naar afrekenen.
Productietraject
Neem de integratie
over de finish.
Een schone lancering is meer dan een werkende knop. Gebruik deze volgorde om toegang, assets, gedrag, kwaliteit en metingen op één lijn te krijgen.
- 01Eigenaar · Product + handel
Bepaal de reikwijdte van de eerste reis
Kies één kanaal, catalogusgroep, klantmoment en succesmaatstaf.
- 02Eigenaar · Engineering
Toegang voorbereiden
Bevestig het partner-id, de goedgekeurde clientgegevens, de winkelrechten en de staging-omgeving.
- 03Eigenaar · Catalogusteam
Lever schone assets in
Lever één kledingstuk per afbeelding aan, vooraanzicht vereist, hoge resolutie, heldere belichting en bestandsnamen gekoppeld aan de SKU.
- 04Eigenaar · Front-end
Integreren in staging
Geef alleen weer op in aanmerking komende producten, koppel varianten en winkelwagenfunctionaliteit, en stem het startpunt af op het merk.
- 05Eigenaar · QA + merk
Start de launch-QA
Test mobiel en desktop, browserdekking, toegankelijkheid, prestaties, visuele getrouwheid en faaltoestanden.
- 06Eigenaar · Commerce + analytics
Inschakelen en meten
Schakel gereedstaande producten in, publiceer de voorbereide ervaring en monitor adoptie, voltooiing en conversie.
Activabasislijn
Goede invoer zorgt voor een beter resultaat.
- JPEG of PNG
- minimaal 2.000 × 2.000 px
- Vooraanzicht vereist
- Achteraanzicht aanbevolen
- Neutrale, gelijkmatige belichting
- SKU of stijlnummer in bestandsnaam
Ontwikkelaarsreferentie
Zoek de volgende
nuttig antwoord.
Begin hier
Aan de slag
Begrijp toegang, ondersteunde platformen en de eerste beslissingen die je team moet nemen.
Officiële referentie ↗ Beheerde integratieShopify-onboarding
Installeer de app, accepteer de overeenkomsten, synchroniseer kledingstukken, pas de knop aan en ga live.
Officiële referentie ↗ Web-sdkAPI-oppervlak
Beoordeel initialisatie, renderopties, groottebepaling, aanpassing en getypeerde interfaces.
Officiële referentie ↗ Partner-APIOpenbare API-referentie
Verken het goedgekeurde server-side interface dat beschikbaar is voor geauthenticeerde partners.
Swagger-referentie ↗ KwaliteitKledingassets
Bereid productafbeeldingen en metadata voor die soepel door de invoer en beoordeling stromen.
SPREEAI-gids ↗ ProductieQA en lancering
Gebruik de gedeelde checklist voor browser, prestaties, toegankelijkheid en livegang.
SPREEAI-gids ↗ OndersteuningProbleemoplossing
Los de meest voorkomende authenticatie-, in aanmerking komende-, weergave- en prestatieproblemen op.
SPREEAI-gids ↗ DocumentatieImplementatiehandleidingen
Blader door openbare quickstarts, activastandaarden, lanceringschecklists en handleidingen voor probleemoplossing.
Open documentatie ↗Geen overeenkomende ontwikkelaarsbronnen. Probeer “Shopify,” “SDK,” “assets” of “QA.”
Bouwen voor productie
De details die beschermen
de klantervaring.
Beveiliging
Bewaar geheimen aan de serverzijde, gebruik alleen uitgegeven omgevingen en roteer inloggegevens via de partnerworkflow.
Privacy
Vraag klantbeelden op met duidelijke toestemming en stem de gegevensverwerking af op uw goedgekeurde integratieplan.
Prestatie
Laad de ervaring waar dat nodig is, test echte apparaten en monitor regressies op productpagina's.
Toegankelijkheid
Behoud toetsenbordtoegang, focusvolgorde, toegankelijke namen en een bruikbaar pad wanneer de ervaring niet beschikbaar is.
Veelgestelde vragen voor ontwikkelaars
Vragen vooraf
de eerste commit.
Welke integratie moeten we kiezen?
Gebruik de Shopify-app voor het snelste beheerde pad, de Web SDK voor aangepaste of headlesse webplaatsing, de native SDK's voor app-ervaringen en de goedgekeurde API-referentie voor server-side workflows die tijdens de onboarding zijn overeengekomen.
Waar komen inloggegevens vandaan?
SPREEAI geeft de partner-ID en goedgekeurde inloggegevens af tijdens de onboarding. De browser-SDK gebruikt een client-ID en partner-ID. Integreer nooit een clientgeheim in front-end-code.
Vereist de Shopify-app API-sleutels?
De huidige Shopify App-onboardingflow verbindt de winkel na de vereiste overeenkomsten en abonnementsstap; de managed app vereist niet dat sleutels in het instelscherm worden gekopieerd.
Waarom verschijnt de Pasvorm-knop niet?
Bevestig dat het kledingstuk klaar is met verwerken, is ingeschakeld voor Passen, is gekoppeld aan het actieve product of de actieve variant, en dat het app-blok of de SDK-container aanwezig is op het productwatersjabloon.
Welke cliëntgebeurtenissen zijn er beschikbaar?
De gedocumenteerde SDK-callbacks hebben betrekking op kliks op de Pas-aan-knop en winkelwageninteracties. Sluit deze aan op je analytische laag zonder klantafbeeldingen of onnodige persoonsgegevens op te nemen.
Zijn server-webhooks beschikbaar?
Server-push webhooks maken geen deel uit van de momenteel gepubliceerde SDK-documentatie. Stem eventuele server-side eventvereisten af met Partner Engineering voordat u hierop vertrouwt.
Waar halen ontwikkelaars hulp?
Gebruik het technische ondersteuningstraject dat tijdens de onboarding of per e-mail is verstrekt support@spreeai.com. Voeg de omgeving, product-id, browser of apparaat, tijdstempel en een beknopt stappenplan voor reproductie toe; stuur nooit geheimen mee.
Wanneer is de ondersteuning voor het Amazon Partner Network beschikbaar?
De integratie van het Amazon Partner Netwerk is in ontwikkeling. Deze is bewust gemarkeerd als Binnenkort beschikbaar totdat de onboarding- en productie-interface klaar zijn voor externe ontwikkelaars.
Klaar om te bouwen?