3

对于不支持 HTML5 WebGL 的浏览器，是否可以录制 HTML5 WebGL 视频播放的视频（包括声音）？例如，是否可以在后端以大多数浏览器/设备都能接受的格式记录 SeriouslyJS (http://seriouslyjs.org/) 内容？

我做了很多后端的事情，但从来没有涉及后端 GUI 的任何事情......我感谢任何人可以给我的任何帮助。

4

2 回答 2

0

这个问题的答案可能在这篇博文中。作者使用 canvas.toDataURL() 方法将每一帧发送到他创建的一个简单的 node.js 实例。node.js 实例将每个帧保存为 PNG 文件。保存所有帧后，作者似乎使用ffmpeg之类的东西从图像中生成视频。然后，您可以将此视频作为实际动画的替代品。这是一个很好的解决方法，但似乎对作者来说效果很好。

于 2013-01-11T19:24:55.940 回答
0

您可以使用截屏软件（例如ScreenFlow）录制一个或多个静态视频，然后将其作为视频呈现给未启用的浏览器。在 JavaScript 方面，您需要“退回”到视频。伪代码随之而来：

var canvas = document.getElementByID('webgl-canvas');
var webgl = canvas.getContext("experimental-webgl");
if (!webgl) {
  /*
    create a <video> element and replace the <canvas>
    tag with it. Or, have the <video> tag already
    created and hidden with CSS, and display it at this
    time.
  */
} else {
  /*
    Proceed with the interactive, WebGL-enabled version.
  */
}

但是，视频显然会受到技术的限制：它是一个预先录制的非交互式视频。为了实现伪交互风格（只要它像按钮一样简单，根据您的链接），您可以使用HTML5 媒体 API在多个预先录制的视频之间动态切换，但我不知道这会有多好由于带宽和同步问题，在实践中工作。您可能希望在开始序列之前验证每个视频上的缓冲量是否可接受。

注意：上述提议假设至少支持 HTML5，即使代替 WebGL。如果您的目标是不支持 HTML5 的旧版浏览器，我认为您可能会遇到像 YouTube 视频这样简单的东西。

于 2012-07-14T14:50:51.377 回答