在javascript中修剪视频Blob（webm）的开头

Question

我在 Javascript 中有一个视频 Blob 数组； 该阵列被分割成 1 秒的间隔。 我想从视频的开头和结尾修剪。

我发现这篇文章 ( how-to-edit-trim-a-video-in-the-browser ) 描述了如何修剪我的斑点，但它只适用于视频的结尾。

我怀疑删除 blob 的开头会删除标头信息并使 webm 无效。

这有效：
// remove 2 seconds from the end of the video const trimmedVideo = blobArray.slice(0, blobArray.length - 2);

这不起作用：
// remove 1 second from the start of the video const trimmedVideo = blobArray.slice(1, blobArray.length);

如何从视频 blob 的开头开始修剪？

Answer 1

一个 hacky 和次优的解决方案，你可以将你的 blob 设置为视频元素的来源，然后寻找你想要开始修剪的时间戳（甚至可以通过 uri 使用#t=[starttime][,endtime]语法），将该视频元素流式传输到新的录像机，并播放它直到您想要修剪的时间戳。

您可以通过丢弃 blob 块来修剪结尾来稍微简化一下，但是正如@Nuthinking 所说，您会失去精度（即使视频播放器也不会 100% 精确，我相信 firefox 的精度为 2ms）。

虽然我相信这会起作用，并且视频不需要在 DOM 中，但您会以 1:1 的时间进行编码。

我不知道任何其他只涉及 HTML5 的答案。 这个问题很棘手，因为MediaRecorder API 明确表示生成的 blob 块不需要自己播放。

Answer 2

原始解决方案使用的mediarecorder对象有一个名为requestData()的方法，该方法显然会在调用后继续记录在新的 Blob 中。

找到编辑素材的起点后，也许您可以使用它在新的 Blob 中继续录制。