流式视频与WebSockets和渲染与WebGL

Question

我有一个想法，在WebGL中使用WebSockets渲染视频数据流。我知道我们可以将视频数据(一帧)作为纹理从<video>标签导入WebGL。然而，我在想如果我可以使用套接字，这样我就可以有更多的控制它。这个想法可行吗?

谢谢,易

Answer 1

这个家伙用WebSocket实现了简单的摄像头共享。他实际上是一次发送一帧作为一个base64编码的JPEG图像在WebSocket和分配它的src属性的<img>在浏览器端一旦收到。

根据页面，他在Chrome上达到640×480 @ 30 fps，在iPhone/iPad上达到320×240 @ 30 fps。

我不明白为什么你不能使用图像数据之后创建一个WebGL纹理:

var textureImg = document.getElementById("myTextureImg");
var texture = gl.createTexture();
gl.activeTexture(gl.TEXTURE0);
gl.bindTexture(gl.TEXTURE_2D, texture);
gl.texImage2D(gl.TEXTURE_2D, 0, textureImg);
gl.generateMipmap(gl.TEXTURE_2D);