Bouwen · Mobile Try-On

Voeg virtual try-on toe aan een iOS- of Android-app

In één zin

Houd de Photta API key op je backend; stel een proxy-endpoint (/mobile/try-on) beschikbaar dat de productafbeelding en mannequin ID accepteert, dit doorstuurt naar /api/v1/tryon/apparel, het generatie-ID koppelt aan de gebruiker en een status-endpoint biedt dat de mobiele app elke 3 seconden pollt totdat de afbeelding gereed is. De telefoon weet nooit dat de Photta key bestaat.

API-sleutel ophalenBekijk de virtual try-on API
  • Credits: 5 credits bij 2K · 6 credits bij 4K
  • Typische duur: 1.5–4 min
  • Verwerking: async, polling

Elk getal op deze pagina is afkomstig uit de Photta-API-documentatie · gecontroleerd

Je apparaat communiceert nooit rechtstreeks met Photta — het communiceert met je backend, en je backend communiceert met Photta. Die scheiding zorgt ervoor dat je API key niet op de telefoon van de gebruiker belandt, je rate limits je eigen verantwoordelijkheid blijven en je app goedgekeurd kan worden in elke store.

RESPONSE=$(curl -s -X POST https://api.photta.app/api/v1/tryon/apparel \
  -H "Authorization: Bearer $PHOTTA_API_KEY" \
  -H "Content-Type: application/json" \
  -d '{
  "product_type": "top",
  "product_images": [
    "https://cdn.yourstore.com/products/shirt-front.jpg"
  ],
  "product_back_image": "https://cdn.yourstore.com/products/shirt-back.jpg",
  "product_category": "t_shirt",
  "mannequin_id": "mnk_f3a9b1",
  "pose_id": "pose_c2d4e5",
  "background": "https://cdn.yourstore.com/backgrounds/studio-loft.jpg",
  "lock_background": true,
  "resolution": "2K",
  "aspect_ratio": "3:4",
  "body_size": "M",
  "expression": "neutral",
  "user_instruction": "Keep the collar pattern crisp and centered."
}')
ID=$(echo "$RESPONSE" | jq -r '.data.id')

Hoe het werkt

Apparaat, backend, Photta — drie lagen, één flow

Vijf concrete beslissingen die je moet nemen vóór de eerste App Store-inzending.

  1. Stap 1

    Houd de key op je server

    Lever de Photta key niet mee in je app-binary, info.plist, AndroidManifest of enig build-time env-bestand — het decompileren van de binary is triviaal en de key zal uitlekken. Je backend is de enige plek waar de key thuishoort.

  2. Stap 2

    Ontwerp een strak proxy-endpoint

    Stel /mobile/try-on beschikbaar aan je app. Authenticeer het verzoek met je eigen gebruikerssessie — geef geen ruwe API keys door via de proxy. De proxy roept vervolgens Photta aan namens de geauthenticeerde gebruiker.

  3. Stap 3

    Spiegel de taakstatus van Photta in je database

    Wanneer Photta een generatie-ID retourneert, voeg dan een rij in je eigen jobs-tabel in met user_id als sleutel. Je mobiele app pollt JOUW /mobile/try-on/:id — niet die van Photta — zodat rate limits schalen volgens JOUW plan, niet per apparaat van de gebruiker.

  4. Stap 4

    Cache de resultaat-URL

    Wanneer Photta completed rapporteert, kopieer dan output_url naar je jobs-rij en download optioneel de bytes naar je eigen CDN. Mobiele gebruikers betalen per MB — hotlink de CDN van Photta niet voor de gehele levensduur van een PDP-impressie.

  5. Stap 5

    Ga elegant om met offline situaties

    Mobiele verbindingen vallen weg tijdens het pollen. Toon liever een status 'opnieuw proberen' dan een harde foutmelding, probeer opnieuw met exponential backoff en sla het taak-ID lokaal op, zodat een koude start doorgaat waar de vorige sessie eindigde.

Drie lagen van de integratie

App-contract, backend-proxy, client-side polling — precies de scheiding die je nodig hebt.

// Never ship your PHOTTA_API_KEY to the device. The mobile app
// calls YOUR API; your API calls Photta. Simple, safe, billable.
POST /mobile/try-on
{
  "productImageUrl": "...",
  "mannequinId": "...",
  "poseId": "..."
}
// → returns { jobId } immediately
const res = await fetch("https://api.photta.app/api/v1/tryon/apparel", {
  method: "POST",
  headers: { Authorization: `Bearer ${process.env.PHOTTA_API_KEY}`, "Content-Type": "application/json" },
  body: JSON.stringify({
    "product_type": "top",
    "product_images": [
      "https://cdn.yourstore.com/products/shirt-front.jpg"
    ],
    "product_back_image": "https://cdn.yourstore.com/products/shirt-back.jpg",
    "product_category": "t_shirt",
    "mannequin_id": "mnk_f3a9b1",
    "pose_id": "pose_c2d4e5",
    "background": "https://cdn.yourstore.com/backgrounds/studio-loft.jpg",
    "lock_background": true,
    "resolution": "2K",
    "aspect_ratio": "3:4",
    "body_size": "M",
    "expression": "neutral",
    "user_instruction": "Keep the collar pattern crisp and centered."
  }),
});
const { data } = await res.json(); // data.id, data.status
// Store { id: data.id, user_id, status: "processing" } in your jobs table
// and return { jobId: data.id } to the device.
// App polls YOUR /mobile/try-on/:id — you poll Photta server-side
// and mirror status. This way rate limits are YOUR problem, not
// each device's, and you can add caching + analytics in one place.
async function pollJob(jobId: string) {
  while (true) {
    const { status, imageUrl } = await api.get(`/mobile/try-on/${jobId}`);
    if (status === "completed") return imageUrl;
    if (status === "failed") throw new Error("Try-on failed");
    await sleep(3000);
  }
}

Veelgestelde vragen van developers

Een door Photta aangedreven mobiele feature uitrollen

Kan ik de Photta API rechtstreeks aanroepen vanaf het apparaat?

Technisch gezien wel — maar dan moet je je API key meeleveren in de app-bundle, waardoor je key naar elk apparaat wordt gestuurd dat de app installeert. Routeer via je eigen backend, zodat de key op een server blijft die jij beheert.

Hoe ga ik om met trage mobiele netwerken?

Twee dingen. Eén: dien de taak in vanaf de backend, niet vanaf het apparaat — je uploadt alleen een productafbeelding van de telefoon naar je eigen API. Twee: poll je eigen status-endpoint met intervallen van 3 seconden en een exponential backoff bij fouten. Als de gebruiker van tab wisselt of het signaal verliest, bewaar het taak-ID dan in local storage, zodat ze verder kunnen wanneer ze terugkeren.

Ondersteunt Photta webhooks?

Nee. Polling is het enige voltooiingssignaal dat de API biedt, dus behoud de worker loop — en stuur een server-sent event naar de telefoon zodra je eigen backend ziet dat de taak is voltooid.

Kan ik Photta gebruiken met React Native of Flutter?

Ja — vanuit de JavaScript- / Dart-kant roep je gewoon je eigen backend-API aan. Er lekt niets door van de Photta-specifieke details. Flutter-apps fetchen /mobile/try-on op exact dezelfde manier als een app in React Native of native SwiftUI / Jetpack Compose.

Maakt het reviewteam van Apple zich druk om deze integratie?

Nee — want je app roept Photta niet aan. Deze roept je eigen backend aan met je eigen authenticatie. Vanuit het perspectief van Apple ben je een normale app met een REST-backend. Hetzelfde geldt voor Google Play en Huawei AppGallery.

Gerelateerde pagina's

Referentie

Elk getal op deze pagina is afkomstig uit de Photta-API-documentatie · gecontroleerd

Lever virtual try-on op in je volgende app-release

Drie dunne lagen, nul SDK-footprint op het apparaat. Vraag een API key aan en koppel de proxy in een middag aan elkaar.

API-sleutel ophalenLees de quickstart