将Canvas流发送到UDP多播地址

时间:2017-05-19 12:28:07

标签: javascript html canvas udp video-streaming

我目前有一个用户可以画画的画布。 我现在正在做的是:

var canvas = $('#can')[0];
var ctx = canvas.getContext('2d');
var stream = canvas.captureStream(60);

var video = $('#video')[0];
video.srcObject = stream;

所以我获得了画布,并使用captureStream方法获取画布内容的实时流,然后将其作为video放入html srcObject标记中。

我现在想要实现的是,实时流(保存在变量stream中)被发送到udp多播地址,因此我可以使用MPV或其他视频播放器接收它。

那么您可以向我提供有关如何开始使用此方法的任何方法吗?或者有一种简单的方法可以做到这一点吗?

1 个答案:

答案 0 :(得分:1)

即使它在技术上不是通过UDP,因为你添加它可能是另一种网络播放器,只要你可以阅读流,你应该看看你可以使用WebRTC做什么。

这是webtorrent在浏览器中用于传输协议的内容,您可以利用它并将其用作播放器。

使用captureStream并将其发送到另一个视频元素,this page上显示了如何实施该示例的一个很好的示例。它需要在Chrome设置中启用一些实验性标志,但实际上并不知道它是否可能是您的用例中的无操作。

如果你看一下有关UDP广播的this answer,那就建议使用SRTP,如果这真的是你想做的话。 @Kaiido引用的那个也是开始这个​​主题的好资源。

您还可以查看nile.js