JavaScript Drop-in SDK for SaaS Developers

Selling a script on CodeCanyon or building a custom JavaScript SaaS? Use our single-file, zero-dependency JavaScript class to instantly support image and video generation with multi-model failover.

1. The Drop-in Class

Save this as creativeai.js. It uses native JavaScript fetch(), requiring zero npm dependencies.

/**
 * CreativeAI Drop-in JavaScript SDK
 * Zero dependencies, built-in failover routing.
 */
export class CreativeAI {
    constructor(apiKey) {
        this.apiKey = apiKey;
        this.baseUrl = "https://api.creativeai.run/v1";
    }

    async request(endpoint, payload) {
        const response = await fetch(`${this.baseUrl}${endpoint}`, {
            method: "POST",
            headers: {
                "Authorization": `Bearer ${this.apiKey}`,
                "Content-Type": "application/json"
            },
            body: JSON.stringify(payload)
        });
        
        if (!response.ok) {
            throw new Error(`Request Error: ${response.statusText}`);
        }
        
        return await response.json();
    }

    async generateImage(prompt, model = "seedream-3.0", size = "1024x1024") {
        return this.request("/images/generations", {
            model,
            prompt,
            size,
            n: 1
        });
    }

    async generateVideo(prompt, model = "auto", webhook_url = null) {
        const payload = {
            model,
            prompt,
            failover: true
        };
        if (webhook_url) {
            payload.webhook_url = webhook_url;
        }
        return this.request("/video/generations", payload);
    }
}

2. Usage Example

Instantiate the client and call the methods. The auto model parameter handles fallback logic automatically to ensure your users never see downtime.

import { CreativeAI } from './creativeai.js';

const client = new CreativeAI("YOUR_API_KEY");

async function run() {
    try {
        // 1. Generate an Image
        const imageResponse = await client.generateImage("A cinematic sunset over a futuristic city");
        if (imageResponse.data?.[0]?.url) {
            console.log("Image URL:", imageResponse.data[0].url);
        }

        // 2. Generate a Video (async)
        const videoResponse = await client.generateVideo(
            "Drone shot of a coastal highway", 
            "auto", // Auto-routes to Kling or Seedance
            "https://your-app.com/webhook/video-complete"
        );
        
        console.log("Video Generation Task ID:", videoResponse.id);
    } catch (error) {
        console.error("Failed:", error);
    }
}

run();

Upgrade Your Script Today

Give your CodeCanyon buyers access to the most reliable media API. Support DALL-E 3 fallback, Kling V3, and Seedance instantly.

Back to all tutorials