Skip to main content

RTSP H264 流 MSE 播放

elsampsa/websocket-mse-demo 项目介绍:

It this demo we're streaming live video from an RTSP camera to your HTML5 browser.

Video is streamed as H264 encapsulated in MP4. No transcoding takes place in the stream-to-browser pipeline. No browser-side flash or pure-javascript decoders required.

Video is decoded and presented in the browser using the W3 Media Source Extensions that is well supported by all major browsers by > now.

Only H264 is supported - browser MSE's do not support H246 yet (and neither does libValkka).

实现了浏览器 MSE (Media Source Extensions) 播放相机 RTSP (Real Time Streaming Protocol) 流。动手体验一下咯~


# 系统 Ubuntu 18
# 如有 conda 虚拟环境,请停用# conda deactivate
# 获取代码git clone --depth 1
# 安装 libValkkasudo apt-add-repository ppa:sampsa-riikonen/valkkasudo apt-get updatesudo apt-get install valkka
# 安装 nginxsudo apt-get install nginx
# 安装 python websocketspip3 install websockets
# 准备 nginx 用户权限sudo addgroup nginxsudo adduser $USER nginxsudo chgrp -R nginx /var/lib/nginx /var/log/nginxsudo chmod -R g+r+w+x /var/lib/nginx /var/log/nginx# 切换用户组newgrp nginxid
# 测试 nginx 工作是否正常(无 Permission denied)cd websocket-mse-demonginx -p $PWD -c ./nginx.conf -g 'error_log error.log warn;'
# 设置相机发送 H264(该项目只支持 H264)


发送 RTSP 流:

sudo snap install vlc# allow camera permissionsnap connect vlc:camera :camera
# 发送 ~/Videos/test.mp4 文件(循环)# file:///$HOME/Videos/test.mp4 --loop \--sout '#gather:transcode{vcodec=h264}:rtp{sdp=rtsp://:8554/test}' \--network-caching=1500 --sout-all --sout-keep
# 或,发送 /dev/video0 webcam(实时)vlc v4l2:///dev/video0:chroma=yuyv:width=640:height=480:fps=30 \--sout '#transcode{vcodec=h264,width=640,height=480}:rtp{sdp=rtsp://:8554/test}'
# 测试接收 RTSP 流vlc rtsp://


killall -9 nginxpython3 rtsp://


xdg-open http://localhost:8089