如何通过API或JS组合视频和音频? [英] How to combine video and audio through API or JS?

问题描述

我正在设计一个执行以下操作的系统:

I am working to design a system which does the following:

1. 用户上传视频，JS代码找到视频的长度.

1. User uploads a video, JS code finds the length of the video.

执行对现有服务的HTTP调用以检索相同长度的音频轨道.

Performs HTTP calls to an already-existing service to retrieve an audio track of the same length.

同步并组合音频和视频(长度完全相同).我想做的最好的事情是同时播放它们(完全可以使用HTML5播放)，但是我希望能够让用户下载组合文件，或者说...将其上传到YouTube通过其API.

Synchronize and combine the audio and video (which are the exact same length). The best thing I could think to do is to play them both at the same time (entirely doable with HTML5), but I want to be able to have a user download a combined file, or be able to say... upload it to YouTube through their API.

我一直在进行大量的谷歌搜索，但是到目前为止，还没有找到任何可以做到这一点的服务或代码.

I have been doing lots of googling, and so far have not found any services or code which might be able to do this.

我熟悉JavaScript，Ruby on Rails，HTML，CSS，jQuery，以及AngularJS和Backbone.js.如果一种解决方案以这些语言中的一种或我可以通过HTTP访问的某种语言存在，那就太好了.

I am familiar with JavaScript, Ruby on Rails, HTML, CSS, jQuery, and both AngularJS and Backbone.js. If a solution exists in one of those languages, or perhaps something I can access through HTTP, that would be wonderful.

推荐答案

我目前正在使用 FFmpeg.wasm .这是一个很棒的工具，但是我还没有找到使用普通JavaScript做到这一点的方法，因为有时音频和视频具有不同的编解码器.我做了一个合并视频并返回一个Uint8Array的函数，该函数可以在Blob中使用.

I am currently using FFmpeg.wasm. It is a great tool, but I have not found a way to do this with plain JavaScript because the audio and video have different codecs sometimes. I made a function to merge videos and return a Uint8Array, which can be used in a blob.

<script src='https://unpkg.com/@ffmpeg/ffmpeg@0.9.6/dist/ffmpeg.min.js'></script>

async function mergeVideo(video, audio) {
    let { createFFmpeg, fetchFile } = FFmpeg;
    let ffmpeg = createFFmpeg();
    await ffmpeg.load();
    ffmpeg.FS('writeFile', 'video.mp4', await fetchFile(video));
    ffmpeg.FS('writeFile', 'audio.mp4', await fetchFile(audio));
    await ffmpeg.run('-i', 'video.mp4', '-i', 'audio.mp4', '-c', 'copy', 'output.mp4');
    let data = await ffmpeg.FS('readFile', 'output.mp4');
    return new Uint8Array(data.buffer);
};

这篇关于如何通过API或JS组合视频和音频?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！