Shotstack Direct Integration

Pass generated AI video clips directly to your Shotstack rendering pipeline. Start an async video generation in CreativeAI, and our webhook will automatically push the final URL into Shotstack to apply text overlays, audio, and compositing.

1. Setting up the Express Webhook

When CreativeAI finishes generating your video (typically 30-60s), it will POST to your webhook. Parse the output URL and forward it to Shotstack.

javascript

const express = require('express');
const axios = require('axios');
const app = express();

app.use(express.json());

// CreativeAI sends a POST to this webhook when generation finishes
app.post('/webhook/creativeai', async (req, res) => {
    const payload = req.body;
    
    if (payload.status !== 'completed' || !payload.output_url) {
        return res.status(400).send('Generation failed');
    }

    console.log("CreativeAI returned Asset:", payload.output_url);

    // Build the Shotstack JSON payload
    const shotstackJson = {
        timeline: {
            background: "#000000",
            tracks: [
                {
                    clips: [
                        {
                            asset: {
                                type: "video", // Assuming we generated video
                                src: payload.output_url
                            },
                            start: 0,
                            length: 5
                        }
                    ]
                },
                {
                    clips: [
                        {
                            asset: {
                                type: "title",
                                text: "AI Generated Pipeline",
                                style: "minimal"
                            },
                            start: 0,
                            length: 5,
                            effect: "zoomIn"
                        }
                    ]
                }
            ]
        },
        output: { format: "mp4", resolution: "1080" }
    };

    try {
        // Post the render request to Shotstack
        const response = await axios.post('https://api.shotstack.io/edit/v1/render', shotstackJson, {
            headers: {
                'x-api-key': process.env.SHOTSTACK_API_KEY,
                'Content-Type': 'application/json'
            }
        });
        
        console.log("Shotstack rendering started, ID:", response.data.response.id);
        res.status(200).send('OK');
    } catch(err) {
        console.error("Shotstack Error:", err);
        res.status(500).send('Failed to send to Shotstack');
    }
});

app.listen(3000, () => console.log('Webhook server running on port 3000'));

2. Submit the Generation

Submit your text-to-video request to CreativeAI with webhook_url set.

bash

curl -X POST https://api.creativeai.run/v1/video/generations \
  -H "Authorization: Bearer YOUR_CREATIVEAI_KEY" \
  -H "Content-Type: application/json" \
  -d '{
    "model": "auto",
    "prompt": "Drone shot of futuristic city",
    "webhook_url": "https://your-server.com/webhook/creativeai"
  }'

Automate Full Video Pipelines

Back to all tutorials