/Web-Rtmp

Play rtmp video stream on the web page...without Flash. (Javascript)

Primary LanguageJavaScript

Web-Rtmp

在网页上播放RTMP视频流,通过Websocket。

WARNING ============

这个项目很大程度上只能算可行性验证,不适合作为 library 使用。试验结论是:用 js 解码视频效率已经够低了,rtmp 协议增加了许多额外开销,如果单纯为了播放视频,并不明智。不如用纯粹的 ws 传送 h264 流。

基本原理

  • 服务端

    ./websockify.py 1999 <rtmp_server>:1935
  • 浏览器

    • 使用 node-rtmpapi 解析 RTMP 协议,完成握手和通信。 (yingDev的fork 增加了浏览器支持、修正了几个错误)

    • 提取其中的 H264 视频流

    • 喂给 Broadway 解码

    decoder.decode(frame);

使用

//比如 rtmp://helloworld.com/live/abc ---> app='live', streamName='abc', rtmp_server='helloworld.com'
// ./websockify.py 1999 helloworld.com:1935
var player = new WebRtmpPlayer('ws://127.0.0.1:1999', '<app>', '<streamName>', 'rtmp://<rtmp_server>/<app>');
player.canvas.style['height'] = '100%';
document.getElementById("vidCont").appendChild(player.canvas);

运行

git clone https://github.com/yingDev/Web-Rtmp.git
cd Web-Rtmp
git submodule update --init --recursive
cnpm install
# set your rtmp params in test.js first, then 
webpack -w
# setup test server
./websockify/websockify.py 1999 <rtmp_server>:1935
open index.html

局限

  • Broadway:
    The decoder ...does not support weighted prediction for P-frames and CABAC entropy encoding...

参考资料