这个问题已经在这里有一个答案：
- 如何帆布动画保存为GIF或WEBM？ 2个回答
我试图创建一个使用fabricJS这将允许用户在画布和它的一些文字上添加视频的应用程序。 我曾直到在画布上添加视频和文本实现这一点。 但我不能让任何想法画布导出为MP4格式。
预期的输出是一样，视频正在播放的背景并没有在上特有的位置上的视频文本。
有没有什么解决方案，可以帮助我实现这一目标？
还有在画布上添加了一个视频，我想导出这个帆布包括视频的声音。
这里是片断
$(document).ready(function() { canvas = new fabric.Canvas('c'); canvas.setWidth(480); canvas.setHeight(360); var video1El = document.getElementById('video1'); var video1 = new fabric.Image(video1El, { left: 0, top: 0 }); canvas.add(video1); video1El.load(); $(document.body).on('click', '#play' ,function(){ var iText = new fabric.IText("sample text", { fill: 'red', fontSize: 60, left: 10, top: 10 }) canvas.add(iText); video1El.play(); }); $(document.body).on('click', '#exportvideo' ,function(){ //code to export canvas as video }); fabric.util.requestAnimFrame(function render() { canvas.renderAll(); fabric.util.requestAnimFrame(render); }); }); <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/fabric.js/2.2.3/fabric.min.js"></script> <button id="play">play</button> <button id="exportvideo">Export as video</button> <canvas id="c" width="300" height="300"></canvas> <video crossorigin="anonymous" id="video1" style="display: none" class="canvas-img" width="480" height="360"> <source id="video_src1" src="http://commondatastorage.googleapis.com/gtv-videos-bucket/sample/BigBuckBunny.mp4" type="video/mp4"> </video> 
