html - 后端录制 HTML5 WebGL 视频

Question

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

我做过很多后端工作，但从未做过任何涉及后端 GUI 的事情……我很感激任何人能给我的帮助。

Answer 1

您可以使用屏幕捕获软件(例如 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 media API在多个预先录制的视频之间动态切换，但由于带宽和同步问题，我不知道这在实践中效果如何。在开始序列之前，您可能想要验证每个视频是否有可接受的缓冲量。

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