Make profitable web app - Using ffmpeg.wasm to build a web app for Add Background Music To Video

It's very easy to create the web app with ffmpeg.wasm Demo here const { createFFmpeg, fetchFile } = FFmpeg; const ffmpeg = createFFmpeg({ corePath: "./ffmpeg-core.js", log: true, }); (async () => { await ffmpeg.load(); const dataInputVideo = await fetchFile('video.mp4'); const dataInputAudio = await fetchFile('music.mp3'); ffmpeg.FS('writeFile', 'video.mp4', dataInputVideo); ffmpeg.FS('writeFile', 'music.mp3', dataInputAudio); await ffmpeg.run('-i', 'video.mp4', '-i', 'music.mp3', '-c:v', 'copy', '-c:a', 'aac', '-strict', 'experimental', '-map', '0:v:0', '-map', '1:a:0', 'output.mp4'); const data = ffmpeg.FS('readFile', 'output.mp4'); const video = document.getElementById('player'); video.src = URL.createObjectURL(new Blob([data.buffer], { type: 'video/mp4' })); })();

Mar 19, 2025 - 09:39

Make profitable web app - Using ffmpeg.wasm to build a web app for Add Background Music To Video

It's very easy to create the web app with ffmpeg.wasm

Demo here

const { createFFmpeg, fetchFile } = FFmpeg;
const ffmpeg = createFFmpeg({
    corePath: "./ffmpeg-core.js",
    log: true,
});
(async () => {
    await ffmpeg.load();

    const dataInputVideo = await fetchFile('video.mp4');
    const dataInputAudio = await fetchFile('music.mp3');

    ffmpeg.FS('writeFile', 'video.mp4', dataInputVideo);
    ffmpeg.FS('writeFile', 'music.mp3', dataInputAudio);
    await ffmpeg.run('-i', 'video.mp4', '-i', 'music.mp3', '-c:v', 'copy', '-c:a', 'aac', '-strict', 'experimental', '-map', '0:v:0', '-map', '1:a:0', 'output.mp4');

    const data = ffmpeg.FS('readFile', 'output.mp4');
    const video = document.getElementById('player');
    video.src = URL.createObjectURL(new Blob([data.buffer], { type: 'video/mp4' }));
})();