rtsp流浏览器播放方案rtsp流在主流浏览器并不支持直接播放 。比如大华的视频流:rtsp://admin:123456@
192.168.10.129/cam/realmonitor?channel=1subtype=0,用vlc可以直接播放 。但在浏览器会报ERR_UNKNOWN_URL_SCHEME 。那如何在浏览器中播放呢 。
以下列出几种方案 。
1、安装插件(chrome最新版基本都不支持)
类如:kurento,vlc插件(谷歌浏览器版本41以下),vgx插件(不支持高版本,chrome72.0版本可用)等 。
2、安装软件(中间件,基本都付费)
类如:Appemit(调用vlc插件播放rtsp) , 可以免安装的 , 目前只能windows,免费版会有提示 。
猿大师中间件(底层调用VLC的ActiveX控件,实现在主流浏览器网页中内嵌播放多路RTSP的实时视频流),中间件收费的 。
PluginOK(牛插)中间件 。底层调用ActiveX控件VlcOcx.dll 。(商业用途需付费使用)
3、服务器拉流转发及协议转换
示意图如下所示:
推流--------------服务器转发--------------拉流
方法一览:
a,vlc软件串流到http协议 ,网页显示几个视频需启动几个vlc,只适合应急场景 。
b,html5 + websocket_rtsp_proxy 实现视频流直播 , 基于MSE(Media Source Extensions,W3C),扩展H5的功能 。
步骤:服务器安装streamedian服务器 , 客户端通过video标签播放 。
原型图:
价格:
c.基于nginx的rsmp转发
基于nginx实现rtmp转化,用flash实现播放 。由于flash目前大多浏览器默认禁用,不推荐此方式 。
步骤:安装ffmpeg工具,安装nginx 。
另外nginx-rtmp-module也支持HLS协议,可以搭建基于hls的直播服务器 。
d.rtsp转hls播放,通过ffmpeg转码
步骤:安装ffmpeg工具,ffmpeg转码 。
形如:
ffmpeg -i "rtsp://admin:123456@192.168.10.129/cam/realmonitor?channel=1subtype=0" -c copy -f hls -hls_time 2.0 -hls_list_size 0 -hls_wrap 15 "D:/hls/test.m3u8"
缺点是直播流延时很大 , 对实时要求比较高的不满足要求 。
案例:基于EasyDarwin拾建转码服务器 。参考地址:
通过存储的m3u8去读取 。
e.websocket代理推送,FFMPEG转码
此方法与a,b类似 。但更实用 。
以下提供两种方案:
(1)Gin+WebSocket+FFMPEG实现rtsp转码,参考:
通过FFMPEG把rstp转成http,ginrtsp作为转发服务器,但需要自己写相应接口,需要了解go语言 。
(2)node + ffmpeg + websocket + flv.js,参考:
步骤:在node服务中建立websocket;通过fluent-ffmpeg转码,将RTSP 流转为flv格式;通过flv.js连接websocket , 并对获取的flv格式视频数据进行渲染播放 。
import WebSocket from 'ws'import webSocketStream from 'websocket-stream/stream'import ffmpeg from 'fluent-ffmpeg'// 建立WebSocket服务const wss = new WebSocket.Server({ port: 8888, perMessageDeflate: false })// 监听连接wss.on('connection', handleConnection)// 连接时触发事件function handleConnection (ws, req) {// 获取前端请求的流地址(前端websocket连接时后面带上流地址)const url = req.url.slice(1)// 传入连接的ws客户端 实例化一个流const stream = webSocketStream(ws, { binary: true })// 通过ffmpeg命令 对实时流进行格式转换 输出flv格式const ffmpegCommand = ffmpeg(url).addInputOption('-analyzeduration', '100000', '-max_delay', '1000000').on('start', function () { console.log('Stream started.') }).on('codecData', function () { console.log('Stream codecData.') }).on('error', function (err) {console.log('An error occured: ', err.message)stream.end()}).on('end', function () {console.log('Stream end!')stream.end()}).outputFormat('flv').videoCodec('copy').noAudio()stream.on('close', function () {ffmpegCommand.kill('SIGKILL')})try {// 执行命令 传输到实例流中返回给客户端ffmpegCommand.pipe(stream)} catch (error) {console.log(error)}}
推荐阅读
- 韩川工具直播,韩川电动工具有限公司
- 显卡重插又好了怎么办,显卡重插后一直黑屏
- chatgpt崩溃了吗,chat support
- mysql数据倒序查询,mysql倒叙排列
- php数据统计功能 php统计函数
- 怎么看是不是旗舰显卡电脑,显卡怎么区分丐版还是旗舰款
- pdf如何加大边框,pdf怎么扩大页边距
- 云南特产直播卖货面条文案,直播卖面条技巧
- 怎么执行脚本mysql 怎么执行脚本命令