Skip to main content

我可以在浏览器中渲染视频吗？

在浏览器中渲染视频不受支持。 要渲染视频，您需要连接服务器端渲染，Remotion Lambda，或本地渲染视频。

将来会支持吗？​

目前没有浏览器 API 允许捕获视口。有一些 提议的 API。
如果引入这样的 API，我们可以考虑在将来支持浏览器渲染。

为什么不...​

使用 Chrome 扩展？​

Chrome 扩展可以获得捕获视口的特权。我们可能会在将来探索这一点，但要求用户安装扩展并且渲染时间较慢的组合意味着我们不会优先考虑此功能。

canvas.getImageData()？​

它允许从画布中捕获像素，但 Remotion 视频可以使用任何 Web 技术编写，包括 HTML 和 SVG。画布元素只是 Remotion 支持的内容的子集。

html2canvas？​

它实现了自己的渲染引擎，仅支持 CSS 属性的子集。
您只能访问非常有限的功能集。

SVG <foreignElement>？​

您可以在 SVG <foreignElement> 中呈现 HTML 标记，然后将该 SVG 渲染到画布上，然后调用getImageData()将其转换为图像。

这是最接近浏览器渲染的方法，但存在<img>标记和其他技术的问题。目前还没有完全排除这种可能性，但目前看起来有些繁琐。

如何避免服务器端渲染？​

我们无法完全避免服务器端渲染，但我们正在采取措施使其更加简单和高效：

  • Remotion Lambda 是 Remotion 的一种内置渲染器，只有在使用时才需要付费。

另请参阅​

  • <Player>: 在浏览器中显示 Remotion 视频，无需对其进行编码