DEV Community

RenderIO
RenderIO

Posted on • Originally published at renderio.dev

E-Commerce Video Processing API: Product Video Pipeline

#ffmpeg #video #api #webdev

E-commerce needs video at scale

Product pages with video convert better than static images. A 2023 Wyzowl survey found that 82% of consumers were convinced to buy a product after watching a video. Shopify merchants who added product video to their listings reported higher conversion rates, particularly in electronics and apparel. TikTok Shop requires video for every listing. Amazon encourages product video. Instagram Shopping is video-first.

The problem isn't creating one video. It's processing thousands. Every product needs videos resized for each platform, watermarks for different sales channels, compressed versions for fast loading, and multiple variations for A/B testing.

A video editor can handle 10-20 products per day. An API handles 10,000.

Why use a video processing API

Building video processing in-house means installing FFmpeg on your servers, managing CPU-intensive workloads that spike and idle, handling file storage and delivery, building queuing systems for batch operations, and scaling infrastructure as your catalog grows.

Or you can send an HTTP request and get a processed video back.

RenderIO runs FFmpeg on Cloudflare's edge network. You send a command, it processes the video, you get a download URL. No servers, no scaling, no infrastructure. For a full walkthrough of the API, see the FFmpeg API complete guide.

Core e-commerce video processing API operations

Resize for platforms

Each sales channel has different requirements:

# TikTok Shop: 9:16, 1080x1920
curl -X POST https://renderio.dev/api/v1/run-ffmpeg-command \
  -H "X-API-KEY: your_api_key" \
  -H "Content-Type: application/json" \
  -d '{
    "ffmpeg_command": "-i {{in_video}} -vf \"scale=1080:1920:force_original_aspect_ratio=decrease,pad=1080:1920:(ow-iw)/2:(oh-ih)/2:white\" -c:v libx264 -crf 20 -movflags +faststart {{out_video}}",
    "input_files": { "in_video": "https://cdn.example.com/product-original.mp4" },
    "output_files": { "out_video": "product-tiktok.mp4" }
  }'
Enter fullscreen mode Exit fullscreen mode 
# Amazon: 16:9, 1920x1080, max 5GB
curl -X POST https://renderio.dev/api/v1/run-ffmpeg-command \
  -H "X-API-KEY: your_api_key" \
  -H "Content-Type: application/json" \
  -d '{
    "ffmpeg_command": "-i {{in_video}} -vf \"scale=1920:1080:force_original_aspect_ratio=decrease,pad=1920:1080:(ow-iw)/2:(oh-ih)/2:white\" -c:v libx264 -crf 18 -movflags +faststart {{out_video}}",
    "input_files": { "in_video": "https://cdn.example.com/product-original.mp4" },
    "output_files": { "out_video": "product-amazon.mp4" }
  }'
Enter fullscreen mode Exit fullscreen mode 
# Instagram Shopping: 1:1, 1080x1080
curl -X POST https://renderio.dev/api/v1/run-ffmpeg-command \
  -H "X-API-KEY: your_api_key" \
  -H "Content-Type: application/json" \
  -d '{
    "ffmpeg_command": "-i {{in_video}} -vf \"crop=min(iw\\,ih):min(iw\\,ih),scale=1080:1080\" -c:v libx264 -crf 20 -movflags +faststart {{out_video}}",
    "input_files": { "in_video": "https://cdn.example.com/product-original.mp4" },
    "output_files": { "out_video": "product-instagram.mp4" }
  }'
Enter fullscreen mode Exit fullscreen mode

Add watermarks

Protect product videos on different channels:

curl -X POST https://renderio.dev/api/v1/run-ffmpeg-command \
  -H "X-API-KEY: your_api_key" \
  -H "Content-Type: application/json" \
  -d '{
    "ffmpeg_command": "-i {{in_video}} -i {{in_logo}} -filter_complex \"[1:v]scale=120:-1,format=rgba,colorchannelmixer=aa=0.4[logo];[0:v][logo]overlay=W-w-20:H-h-20[v]\" -map \"[v]\" -map 0:a -c:v libx264 -crf 20 -c:a copy {{out_video}}",
    "input_files": {
      "in_video": "https://cdn.example.com/product.mp4",
      "in_logo": "https://cdn.example.com/brand-logo.png"
    },
    "output_files": { "out_video": "product-watermarked.mp4" }
  }'
Enter fullscreen mode Exit fullscreen mode

The colorchannelmixer=aa=0.4 makes the watermark 40% transparent. Professional without being intrusive.

Compress for fast loading

Product pages need fast-loading video. Here's how to compress without visible quality loss:

curl -X POST https://renderio.dev/api/v1/run-ffmpeg-command \
  -H "X-API-KEY: your_api_key" \
  -H "Content-Type: application/json" \
  -d '{
    "ffmpeg_command": "-i {{in_video}} -c:v libx264 -crf 28 -preset slow -vf \"scale=720:-2\" -c:a aac -b:a 96k -movflags +faststart {{out_video}}",
    "input_files": { "in_video": "https://cdn.example.com/product-hd.mp4" },
    "output_files": { "out_video": "product-web.mp4" }
  }'
Enter fullscreen mode Exit fullscreen mode

This produces a 720p video with aggressive compression. File size typically drops 70-80% while maintaining acceptable quality for product pages. For more compression strategies, check the video compression guide.

Create thumbnails

Extract the best frame for product listing thumbnails:

curl -X POST https://renderio.dev/api/v1/run-ffmpeg-command \
  -H "X-API-KEY: your_api_key" \
  -H "Content-Type: application/json" \
  -d '{
    "ffmpeg_command": "-i {{in_video}} -vf \"select=eq(pict_type\\,I),scale=800:-1\" -frames:v 1 {{out_thumb}}",
    "input_files": { "in_video": "https://cdn.example.com/product.mp4" },
    "output_files": { "out_thumb": "thumbnail.jpg" }
  }'
Enter fullscreen mode Exit fullscreen mode

This extracts the first I-frame (keyframe), which is typically the clearest frame in the video. For more thumbnail strategies including scene detection and quality optimization, see the FFmpeg frame extraction guide.

Building the complete pipeline

One product, all platforms 

async function processProductVideo(productId, videoUrl, logoUrl) {
  const platforms = [
    {
      name: "tiktok",
      command: `-i {{in_video}} -i {{in_logo}} -filter_complex "[1:v]scale=80:-1,format=rgba,colorchannelmixer=aa=0.3[logo];[0:v]scale=1080:1920:force_original_aspect_ratio=decrease,pad=1080:1920:(ow-iw)/2:(oh-ih)/2:white[bg];[bg][logo]overlay=W-w-20:20[v]" -map "[v]" -map 0:a? -c:v libx264 -crf 22 -c:a aac -movflags +faststart {{out_video}}`,
    },
    {
      name: "amazon",
      command: `-i {{in_video}} -vf "scale=1920:1080:force_original_aspect_ratio=decrease,pad=1920:1080:(ow-iw)/2:(oh-ih)/2:white" -c:v libx264 -crf 18 -movflags +faststart {{out_video}}`,
    },
    {
      name: "instagram",
      command: `-i {{in_video}} -i {{in_logo}} -filter_complex "[1:v]scale=80:-1,format=rgba,colorchannelmixer=aa=0.3[logo];[0:v]crop=min(iw\\,ih):min(iw\\,ih),scale=1080:1080[bg];[bg][logo]overlay=W-w-15:H-h-15[v]" -map "[v]" -map 0:a? -c:v libx264 -crf 20 -movflags +faststart {{out_video}}`,
    },
    {
      name: "web-compressed",
      command: `-i {{in_video}} -c:v libx264 -crf 28 -preset slow -vf "scale=720:-2" -c:a aac -b:a 96k -movflags +faststart {{out_video}}`,
    },
  ];

  const jobs = platforms.map(platform =>
    fetch("https://renderio.dev/api/v1/run-ffmpeg-command", {
      method: "POST",
      headers: {
        "X-API-KEY": process.env.RENDERIO_API_KEY,
        "Content-Type": "application/json",
      },
      body: JSON.stringify({
        ffmpeg_command: platform.command,
        input_files: {
          in_video: videoUrl,
          in_logo: logoUrl,
        },
        output_files: { out_video: `${productId}-${platform.name}.mp4` },
      }),
    }).then(r => r.json())
  );

  return Promise.all(jobs);
}
Enter fullscreen mode Exit fullscreen mode

4 API calls per product. 4 platform-ready videos. All processing in parallel.

Batch process catalog 

async function processCatalog(products) {
  const BATCH_SIZE = 100;

  for (let i = 0; i < products.length; i += BATCH_SIZE) {
    const batch = products.slice(i, i + BATCH_SIZE);

    await Promise.all(
      batch.map(p =>
        processProductVideo(p.id, p.videoUrl, p.logoUrl)
      )
    );

    console.log(`Processed ${Math.min(i + BATCH_SIZE, products.length)}/${products.length} products`);
  }
}
Enter fullscreen mode Exit fullscreen mode

1,000 products × 4 platforms = 4,000 API calls. That fits within the Business plan (20,000 commands/month).

Handling processing failures

Video processing can fail for a few reasons, and your pipeline needs to handle each one:

Invalid input URL

The source video doesn't exist or requires authentication. Use signed URLs with at least 1 hour of expiry. If you're pulling from Shopify's CDN, those URLs are public. But if you're hosting on S3, make sure the bucket policy or presigned URL allows access.

Timeout on large files

Videos over 500MB take longer. Poll with reasonable intervals (5-10 seconds) and set a maximum retry count. If a command hasn't completed after 5 minutes, check the error status rather than polling forever.

FFmpeg command errors

A typo in your filter chain fails the whole command. Test commands locally with a sample file before putting them in your pipeline. The error response includes FFmpeg's stderr output, so read it.

async function pollWithRetry(commandId, apiKey, maxAttempts = 60) {
  for (let i = 0; i < maxAttempts; i++) {
    const res = await fetch(`https://renderio.dev/api/v1/commands/${commandId}`, {
      headers: { "X-API-KEY": apiKey },
    });
    const data = await res.json();

    if (data.status === "SUCCESS") return data;
    if (data.status === "FAILED") throw new Error(`FFmpeg failed: ${data.error}`);

    await new Promise(r => setTimeout(r, 5000));
  }
  throw new Error(`Timeout after ${maxAttempts * 5}s`);
}
Enter fullscreen mode Exit fullscreen mode

Webhook-based completion

For production pipelines, polling loops waste resources. Use webhooks instead:

{
  "ffmpeg_command": "-i {{in_video}} -vf \"scale=1080:1920:...\" -c:v libx264 -crf 20 {{out_video}}",
  "input_files": { "in_video": "https://cdn.example.com/product.mp4" },
  "output_files": { "out_video": "product-tiktok.mp4" },
  "webhook_url": "https://your-server.com/api/video-complete"
}
Enter fullscreen mode Exit fullscreen mode

When the command finishes, RenderIO sends a POST to your webhook URL with the command status and output file URLs. Your server processes the callback, updates the product listing, and moves on. No polling. No wasted API calls.

This matters at scale. If you're processing 500 products per day across 4 platforms, that's 2,000 commands. With polling at 5-second intervals and an average processing time of 15 seconds, you'd make 6,000 status checks. With webhooks, you make zero.

Integration with e-commerce platforms

Shopify

Use Shopify's Admin API to upload processed videos back to product listings:

// After RenderIO processing completes
const processedVideoUrl = completedCommand.output_files["product-web.mp4"];

await shopify.product.update(productId, {
  media: [{
    alt: "Product video",
    mediaContentType: "VIDEO",
    originalSource: processedVideoUrl,
  }],
});
Enter fullscreen mode Exit fullscreen mode

For automating this with Zapier (new product triggers video creation automatically), see the Zapier product video automation guide. The n8n video processing guide covers the same flow for n8n users.

WooCommerce

WooCommerce doesn't have native video fields on products. You'll need either a plugin like "Product Video for WooCommerce" or a custom meta field:

const response = await woocommerce.post("products/" + productId, {
  meta_data: [{
    key: "product_video_url",
    value: processedVideoUrl,
  }],
});
Enter fullscreen mode Exit fullscreen mode

This stores the URL in meta_data, but your theme won't display it automatically. You'll need a custom template snippet or a video gallery plugin that reads from meta fields.

TikTok Shop

TikTok Shop video requirements: 9:16 aspect ratio, 1080x1920 minimum, MP4 format, under 500MB, 15-60 seconds. The resize command above handles the format. Upload via TikTok Shop's Content API or manually through Seller Center.

Automating the full workflow

The real power is connecting video processing to your product catalog so it runs automatically. There are two good approaches:

Zapier: New product trigger → RenderIO API → upload to storage. The Zapier product video guide walks through the complete Zap with template overlays and text.

n8n: Webhook or schedule trigger → batch process → upload. More flexibility for complex logic. See the n8n video processing guide.

For batch processing large catalogs at once, the batch process AI videos guide covers parallelization strategies.

Pricing for e-commerce

Catalog size Platforms API calls/month Plan Cost/month
30 products 4 120 Starter $9
250 products 4 1,000 Growth $29
5,000 products 4 20,000 Business $99

Zero egress fees because RenderIO runs on Cloudflare R2. No hidden storage costs. No bandwidth charges.

The math is straightforward: count your products, multiply by the number of platform versions you need per product, and pick the plan that fits. Most small-to-medium stores land on Growth. Large catalogs or stores that reprocess on price/image changes need Business.

FAQ

How long does video processing take?

Typical product videos (30-60 seconds, 1080p source) process in 5-15 seconds per operation. Resizing is faster than complex filter chains. A four-platform pipeline for one product finishes in about 15-20 seconds total since all four commands run in parallel.

Can I process videos when a new product is added?

Yes. Set up a Shopify webhook (or use Zapier/n8n) to trigger video processing whenever a product is created or updated. The Zapier product video guide has the complete setup.

What video formats does TikTok Shop accept?

MP4 is the safe choice. TikTok Shop requires 9:16 aspect ratio, minimum 720x1280 resolution (1080x1920 recommended), H.264 codec, under 500MB, and between 15-60 seconds duration.

How do I handle processing failures?

Check the command status endpoint. Failed commands return a status: "failed" with an error field containing FFmpeg's stderr output. Common fixes: verify your input URL is accessible, check your FFmpeg command syntax, ensure the output format matches the filename extension.

Is there a file size limit?

No hard limit on the API side. Input files are fetched via URL, so the bottleneck is download speed. Videos over 1GB work fine but take longer to fetch and process. For very large files (2GB+), expect processing times of 1-3 minutes.

Top comments (0)