Cloudflare Developers•7mo ago

Need help getting FFmpeg working on Workers (close, have got it working when running locally)

With some help from @Rui Figueira, I can get ffmpeg-wasm working on Workers, but cannot upload the bundle to Cloudflare as it is over 10mb. I have tried to download the wasm binary from a bucket and load it dynamically, but I cannot seem to get it to work with the Workers runtime and the Wrangler build tool. I saw something about Vite maybe being able to use URLs for imports, but I have no experience with this. Has anyone been able to do this? Or know of any solutions. Here is the code:

import createFFmpegCore from '@ffmpeg/core';
import wasm from '@ffmpeg/core/dist/esm/ffmpeg-core.wasm';
import type { FFmpegCoreModule } from '@ffmpeg/types';


(globalThis as any).location = { href: 'https://example.com' };

const mod = {
  instantiateWasm: async (info: any, receiveInstance: any) => {
    const instance = await WebAssembly.instantiate(wasm, info);
    receiveInstance(instance);
  }
};

const ffmpeg = await createFFmpegCore(mod) as FFmpegCoreModule;


export default {

    async fetch(request: Request, env: Env, ctx: ExecutionContext): Promise<Response> {

        const mp3url = "https://sphinx.acast.com/p/acast/s/ftnewsbriefing/e/6830c566a795fd3aefce3aa5/media.mp3"
        const input = await fetch(mp3url);

        ffmpeg.FS.writeFile('input.mp3', await input.bytes());

        ffmpeg.exec(
            '-i', 'input.mp3',
            '-t', '10',
            '-c', 'copy',
            'output.mp3'
        );

        const output = ffmpeg.FS.readFile('output.mp3', { encoding: 'binary' });

        ffmpeg.FS.unlink('input.mp3');
        ffmpeg.FS.unlink('output.mp3');
    
        return new Response(output, {
            headers: {
              'Content-Type': 'audio/mp3',
            },
          });
    }
} satisfies ExportedHandler<Env>;

import createFFmpegCore from '@ffmpeg/core';
import wasm from '@ffmpeg/core/dist/esm/ffmpeg-core.wasm';
import type { FFmpegCoreModule } from '@ffmpeg/types';


(globalThis as any).location = { href: 'https://example.com' };

const mod = {
  instantiateWasm: async (info: any, receiveInstance: any) => {
    const instance = await WebAssembly.instantiate(wasm, info);
    receiveInstance(instance);
  }
};

const ffmpeg = await createFFmpegCore(mod) as FFmpegCoreModule;


export default {

    async fetch(request: Request, env: Env, ctx: ExecutionContext): Promise<Response> {

        const mp3url = "https://sphinx.acast.com/p/acast/s/ftnewsbriefing/e/6830c566a795fd3aefce3aa5/media.mp3"
        const input = await fetch(mp3url);

        ffmpeg.FS.writeFile('input.mp3', await input.bytes());

        ffmpeg.exec(
            '-i', 'input.mp3',
            '-t', '10',
            '-c', 'copy',
            'output.mp3'
        );

        const output = ffmpeg.FS.readFile('output.mp3', { encoding: 'binary' });

        ffmpeg.FS.unlink('input.mp3');
        ffmpeg.FS.unlink('output.mp3');
    
        return new Response(output, {
            headers: {
              'Content-Type': 'audio/mp3',
            },
          });
    }
} satisfies ExportedHandler<Env>;

I thought of maybe recompiling the wasm to only include the formats I needed, but I am unsure on how to do this - might try it tomorrow. If anyone has any ideas or tips, that would be very helpful.

5 Replies

Rui Figueira•7mo ago

Take a look at https://github.com/JorenSix/ffmpeg.audio.wasm/tree/master/build/ffmpeg.audio.core/v5

GitHub

ffmpeg.audio.wasm/build/ffmpeg.audio.core/v5 at master · JorenSix/...

An audio focused ffmpeg build for the web. Contribute to JorenSix/ffmpeg.audio.wasm development by creating an account on GitHub.

Rui Figueira•7mo ago

that ffmpeg.core.wasm is only 5MB from the project README: . This repository provides a audio focused WebAssembly build of ffmpeg together with some examples on how it can be used.

Rui Figueira•6mo ago

https://developers.cloudflare.com/containers/

Cloudflare Docs

Containers (Beta)

Run code written in any programming language, built for any runtime, as part of apps built on Workers.

Rui Figueira•6mo ago

I think containers may be the best tool for running ffmpeg

Rui Figueira•6mo ago

that's actually the usecase of this video: https://www.youtube.com/watch?v=oyOaxMY4eNo

Cloudflare Developers

YouTube

Cloudflare Containers 101 - Run Docker Containers on the Edge

Cloudflare Containers combine the speed and simplicity of Workers with the flexibility of full server-side runtimes like Go, Python, or custom binaries. In this video, we’ll walk you through deploying your first container, understanding how it works, and what you can build with it. Whether you're building AI tools, using legacy binaries, or j...

Gaming

Programming

Need help getting FFmpeg working on Workers (close, have got it working when running locally)

Did you find this page helpful?