Virtual Try-On API Tutorial —
Get On-Model Photos in 12 Seconds

import os

# Load from environment variable
api_key = os.environ.get("PIXELAPI_KEY")
if not api_key:
    raise ValueError("Set PIXELAPI_KEY environment variable")

# Or install python-dotenv and use a .env file:
# pip install python-dotenv requests
# from dotenv import load_dotenv
# load_dotenv()
# api_key = os.getenv("PIXELAPI_KEY")

// Install: npm install node-fetch dotenv
// Create .env file with: PIXELAPI_KEY=pk_your_key

import 'dotenv/config';
const apiKey = process.env.PIXELAPI_KEY;
if (!apiKey) throw new Error('Set PIXELAPI_KEY in .env');

// Base URL
const BASE_URL = 'https://api.pixelapi.dev';

import requests
import os

api_key = os.environ.get("PIXELAPI_KEY")

def submit_tryon(person_url: str, garment_url: str, category: str = "upper_body"):
    """Submit a virtual try-on job."""
    response = requests.post(
        "https://api.pixelapi.dev/v1/virtual-tryon",
        headers={
            "Authorization": f"Bearer {api_key}",
            "Content-Type": "application/json"
        },
        json={
            "person_image": person_url,
            "garment_image": garment_url,
            "category": category
        }
    )
    response.raise_for_status()
    return response.json()

# Example usage
result = submit_tryon(
    person_url="https://example.com/person.jpg",
    garment_url="https://example.com/shirt.jpg",
    category="upper_body"
)
print(f"Job submitted: {result['job_id']}")
print(f"Credits used: {result['credits_used']}")

import 'dotenv/config';

const BASE_URL = 'https://api.pixelapi.dev';
const apiKey = process.env.PIXELAPI_KEY;

async function submitTryOn(personUrl, garmentUrl, category = 'upper_body') {
  const response = await fetch(`${BASE_URL}/v1/virtual-tryon`, {
    method: 'POST',
    headers: {
      'Authorization': `Bearer ${apiKey}`,
      'Content-Type': 'application/json'
    },
    body: JSON.stringify({
      person_image: personUrl,
      garment_image: garmentUrl,
      category: category
    })
  });

  if (!response.ok) {
    const error = await response.json();
    throw new Error(`API Error: ${error.detail || response.status}`);
  }

  return response.json();
}

// Usage
const job = await submitTryOn(
  'https://example.com/person.jpg',
  'https://example.com/shirt.jpg',
  'upper_body'
);
console.log('Job ID:', job.job_id);
console.log('Credits used:', job.credits_used);

import requests
import time
import os

api_key = os.environ.get("PIXELAPI_KEY")

def poll_job(job_id: str, max_wait: int = 120, interval: int = 3):
    """Poll a job until completion or timeout."""
    elapsed = 0
    
    while elapsed < max_wait:
        response = requests.get(
            f"https://api.pixelapi.dev/v1/virtual-tryon/jobs/{job_id}",
            headers={"Authorization": f"Bearer {api_key}"}
        )
        response.raise_for_status()
        data = response.json()
        status = data["status"]
        
        print(f"[{elapsed}s] Status: {status}")
        
        if status == "completed":
            return data
        elif status == "failed":
            raise Exception(f"Job failed: {data.get('error', 'Unknown error')}")
        
        time.sleep(interval)
        elapsed += interval
    
    raise TimeoutError(f"Job did not complete within {max_wait} seconds")

# Full workflow: submit + poll
job = submit_tryon("https://example.com/person.jpg", "https://example.com/shirt.jpg")
result = poll_job(job["job_id"])
print("Done! Image data available.")
print(f"Output: {result['output'][:50]}...")

async function pollJob(jobId, maxWait = 120000, interval = 3000) {
  const start = Date.now();
  
  while (Date.now() - start < maxWait) {
    const response = await fetch(
      `${BASE_URL}/v1/virtual-tryon/jobs/${jobId}`,
      { headers: { 'Authorization': `Bearer ${apiKey}` } }
    );
    
    const data = await response.json();
    const elapsed = Math.round((Date.now() - start) / 1000);
    console.log(`[${elapsed}s] Status: ${data.status}`);
    
    if (data.status === 'completed') return data;
    if (data.status === 'failed') throw new Error(`Job failed: ${data.error}`);
    
    await new Promise(r => setTimeout(r, interval));
  }
  
  throw new Error(`Timeout after ${maxWait/1000}s`);
}

// Full workflow
const job = await submitTryOn('https://example.com/person.jpg', 'https://example.com/shirt.jpg');
const result = await pollJob(job.job_id);
console.log('Result ready!');

import base64
import os

def save_result(job_result: dict, output_path: str = "output.jpg"):
    """Save the try-on result image to disk."""
    img_b64 = job_result["output"]
    
    # Strip data URL prefix if present (e.g., "data:image/jpeg;base64,")
    if "," in img_b64:
        img_b64 = img_b64.split(",")[1]
    
    # Decode and save
    img_bytes = base64.b64decode(img_b64)
    with open(output_path, "wb") as f:
        f.write(img_bytes)
    
    print(f"Saved image: {output_path} ({len(img_bytes):,} bytes)")
    return output_path

# Complete end-to-end example
job = submit_tryon(
    person_url="https://example.com/model.jpg",
    garment_url="https://example.com/blue-shirt.jpg",
    category="upper_body"
)
result = poll_job(job["job_id"])
output_file = save_result(result, "tryon_result.jpg")
print(f"✅ Done! Saved to {output_file}")

import { writeFileSync } from 'fs';

function saveResult(jobResult, outputPath = 'output.jpg') {
  let imgB64 = jobResult.output;
  
  // Strip data URL prefix if present
  if (imgB64.includes(',')) {
    imgB64 = imgB64.split(',')[1];
  }
  
  const imgBuffer = Buffer.from(imgB64, 'base64');
  writeFileSync(outputPath, imgBuffer);
  console.log(`Saved: ${outputPath} (${imgBuffer.length.toLocaleString()} bytes)`);
  return outputPath;
}

// End-to-end
const job = await submitTryOn('https://example.com/model.jpg', 'https://example.com/shirt.jpg');
const result = await pollJob(job.job_id);
saveResult(result, 'tryon_output.jpg');
console.log('✅ Done!');

// Display in browser (React/vanilla JS)
function displayTryOnResult(jobResult) {
  const imgB64 = jobResult.output;
  
  // Create an image element
  const img = document.createElement('img');
  
  // If it's a raw base64 (no prefix), add the prefix
  if (imgB64.startsWith('/9j') || imgB64.startsWith('iVBOR')) {
    img.src = `data:image/jpeg;base64,${imgB64}`;
  } else {
    img.src = imgB64; // Already has data: prefix
  }
  
  img.style.maxWidth = '100%';
  img.alt = 'Virtual try-on result';
  
  document.getElementById('result-container').appendChild(img);
}

// Or in React:
function TryOnResult({ output }) {
  const src = output.includes(',') 
    ? output 
    : `data:image/jpeg;base64,${output}`;
  return <img src={src} alt="Try-on result" style={{maxWidth: '100%'}} />;
}