JavaScript SDK

Use the SuperStyle API from JavaScript in both Node.js and browser environments.

Node.js

Quick example

const API_KEY = "ss_your_key_here";
const BASE_URL = "https://mcll3bnfubyazfg6wekv3xc6fi0dgpyk.lambda-url.us-east-1.on.aws";

async function analyzeOutfit(imageUrl) {
  const response = await fetch(`${BASE_URL}/analyze_outfit`, {
    method: "POST",
    headers: {
      "X-API-Key": API_KEY,
      "Content-Type": "application/json",
    },
    body: JSON.stringify({ image_url: imageUrl }),
  });

  const data = await response.json();
  return data.items;
}

// Usage
const items = await analyzeOutfit("https://example.com/outfit.jpg");
items.forEach((item) => {
  console.log(`${item.item}: ${item.color}`);
});

Generate try-on image (Node.js)

const fs = require("fs");

async function tryOnOutfit(selfiePath, clothingDescription) {
  const selfieBase64 = fs.readFileSync(selfiePath).toString("base64");

  const response = await fetch(`${BASE_URL}/try_on_outfit`, {
    method: "POST",
    headers: {
      "X-API-Key": API_KEY,
      "Content-Type": "application/json",
    },
    body: JSON.stringify({
      selfie_base64: selfieBase64,
      clothing_description: clothingDescription,
      mode: "model_shot",
    }),
  });

  const data = await response.json();

  // Download the image (auto-deletes after 24 hours)
  const imgResponse = await fetch(data.image_url);
  const buffer = Buffer.from(await imgResponse.arrayBuffer());
  fs.writeFileSync("tryon.jpg", buffer);
  console.log("Saved tryon.jpg");
}

await tryOnOutfit("selfie.jpg", "Black leather jacket");

Browser

Identify clothing from a URL

async function analyzeOutfit(imageUrl) {
  const response = await fetch("https://mcll3bnfubyazfg6wekv3xc6fi0dgpyk.lambda-url.us-east-1.on.aws/analyze_outfit", {
    method: "POST",
    headers: {
      "X-API-Key": "ss_your_key_here", // Use a backend proxy in production!
      "Content-Type": "application/json",
    },
    body: JSON.stringify({ image_url: imageUrl }),
  });

  return response.json();
}

Generate try-on from file input

async function handleFileUpload(file, clothingDescription) {
  // Convert file to base64
  const base64 = await new Promise((resolve) => {
    const reader = new FileReader();
    reader.onloadend = () => {
      const base64String = reader.result.split(",")[1];
      resolve(base64String);
    };
    reader.readAsDataURL(file);
  });

  const response = await fetch("https://mcll3bnfubyazfg6wekv3xc6fi0dgpyk.lambda-url.us-east-1.on.aws/try_on_outfit", {
    method: "POST",
    headers: {
      "X-API-Key": "ss_your_key_here",
      "Content-Type": "application/json",
    },
    body: JSON.stringify({
      selfie_base64: base64,
      clothing_description: clothingDescription,
      mode: "model_shot",
    }),
  });

  const data = await response.json();

  // Display the result using the image URL
  const img = document.createElement("img");
  img.src = data.image_url;
  document.body.appendChild(img);
}

// Usage with a file input
document.querySelector("#fileInput").addEventListener("change", (e) => {
  const file = e.target.files[0];
  handleFileUpload(file, "Black leather jacket");
});

Check usage

async function getUsage() {
  const response = await fetch("https://mcll3bnfubyazfg6wekv3xc6fi0dgpyk.lambda-url.us-east-1.on.aws/usage", {
    headers: { "X-API-Key": "ss_your_key_here" },
  });
  return response.json();
}

const stats = await getUsage();
console.log(`Total requests: ${stats.total_requests}`);
console.log(`Today: ${stats.requests_today}`);

Error handling

async function safeApiCall(url, options) {
  const response = await fetch(url, options);

  if (!response.ok) {
    const error = await response.json();

    // Handle rate limiting (429)
    if (response.status === 429) {
      const retryAfter = response.headers.get("Retry-After") || "30";
      console.log(`Rate limited. Retry after ${retryAfter}s`);
      console.log(`Remaining: ${response.headers.get("X-RateLimit-Remaining")}`);
      // Optionally wait and retry:
      // await new Promise(r => setTimeout(r, parseInt(retryAfter) * 1000));
      // return safeApiCall(url, options);
    }

    throw new Error(`API Error (${response.status}): ${error.error}`);
  }

  return response.json();
}