美文网首页
appemit支持chrome edge等浏览器播放rtsp r

appemit支持chrome edge等浏览器播放rtsp r

作者: AppEmit | 来源:发表于2021-02-27 19:26 被阅读0次

    appemit支持chrome edge等浏览器使用VLC 播放rtsp rtmp 解决方案

    项目需要实时播放摄像头rtsp视频流,浏览器不能直接播放,只有通过插件或者转码来实现这个需求。

    要实现这个目的,可以采用的方案非常得多, 

    转码

    html5 + websocket_rtsp_proxy  转码,实现视频流直播,免费版本两年未更新。

    ffmpeg + ngnix + video,rtsp转rtmp播放, 经过测试延时普遍在1-3秒

    ffmpeg + video,rtsp转hls播放,延迟略长(2-6秒),这种方式的理论最小延时为一个ts文件的时长 ,一般为2-3个ts文件的时长

    VLC插件播放 ,可以直接播放RTSP,基于NPAPI,不被最新的 Chrome 和 Firefox 支持

    WebRTC,转码,RTSP 转换为 WebRTC 流,供 web 端显示

    因此,AppEmit提供的本地客户端的浏览器播放RTSP的方案是:

    1 使用webkit内核支持VLC的NPAPI,原有的js代码直接使用,几乎没有延迟

    2 使用vlc的libvlc的API播放,支持多开,几乎没有延迟

    3 使用vlc转码为ogg ,浏览器video标签直接播放,延迟约1秒

    4 rtsp转换为WebRTC播放,浏览器直接播放,延迟800ms

    appemit支持chrome等浏览器使用VLC 播放rtsp rtmp 

    方法1 使用NPAPI播放vlc的网页插件

    HTML5的可以支持RTMP 但是无法播放RTSP,flash也止步于RTMP,最后同事推荐了个开源的好东东 VLC ,请教谷歌大神之后,这货果然可以用来让各浏览器(IE activex方式,谷歌、FF)实现播放RTSP视频流,那真是极好的~~ 废话不多说了附上参考文档和案例,大家自己看吧。

    视频是用的海康网络摄像头(支持RTSP,标准H.264 RTP封装的设备),可以通过 rtsp://admin:12345@192.0.0.64:81/h264/ch1/main/av_stream  对摄像头进行读取RSTP流。在谷歌浏览器下实现web显示实时监控画面步骤:

    1. 下载vlc -  http://www.videolan.org/vlc/  开源的好东西,并安装(本人测试系统为WIN8.1 64bit 下载32bit的就可以,XP也没问题);

    2. 安装,并勾选Mozila支持;

    3. 实时播放代码如下

    代码中的具体参数含义,大家可以移步这里:

    https://wiki.videolan.org/Documentation:WebPlugin/

    说明文档很详细,可以使用js进行各种操作,修改视频地址、建立播放列表、暂停、播放、音量控制等。

    但是最新版本的chrome firefox已经不支持NPAPI。

    Appemit可以解决此问题,支持最新版本的chrome  360 IE  edge  firefox QQ 等浏览器打开vlc插件,播放rtsp rtmp.

    使用 webkit 网页的 vlc 插件直接打开 Rtsp 流,可以使用 npvlc.dll 即 NPAPI 技术 或者 axvlc.dll 见案例 demo\htmlDemo\rtsp.html,  {"emit":"open","Obj":"media","AppType":1,"pos":1,"AppId":1, -45- "par":{ "mrl":"rtsp://wowzaec2demo.st reamlock.net/vod/mp4:BigBuckBunny_115k.mov","htmlStr":null,"kernel":2},"pa r0":{"fullscreen":true,"volume":70,"autoplay":true,"controls":true }}

    方法2 使用libvlc的插件直接播放

    Appemit支持多开,截图等功能

    支持多开, 见案例 demo\htmlDemo\rtsp.html

    {"emit":"open","Obj":"libvlc","AppType":1,"pos":1,"AppId":1,"par":{ "mrl":"rtsp://wowzaec2demo.st reamlock.net/vod/mp4:BigBuckBunny_115k.mov","localFile":0},"par0":{"fullscreen":1,"volume":70, "autoplay":1,"controls":0 }}

    方法3 使用vlc转码为ogg ,浏览器video标签直接播放,延迟约1秒

    使用 Vlc 提供服务,转化编码,有延迟,适用精度要求不高的场所,这样只是使用了后台服 务而没有插件。 见案例 demo\htmlDemo\rtsp_ogg.html

    举例:将 mp4 转化为 rtsp(如果有 rtsp 直接使用),再将 rtsp 转化为 ogg,在 html5 的播放 器播放

    {"emit":"open","Obj":"media","AppType":1,"AppId":"AppId_lvcSvr1","AppShow":0,"p ar":{"gui":0,"cmds":["-vvv \"file:///${dir_Cur}/demo/htmlDemo/file/h1.mp4\" --loop --sout \"#transcode{vcodec=h264,acodec=mpga,ab=128,channels=2,samplerate=44100}:rtp{sdp=r tsp://:8554/vlc}\" ","-vvv \"rtsp://:8554/vlc\" --loop :sout=#transcode{vcodec=theo,vb=800,acodec=vorb,ab=128,channels=2,samplera te=44100}:http{mux=ogg,dst=:8080/stream} :sout-all :sout-keep\" "]}}

    方法4 rtsp转换为WebRTC播放,浏览器直接播放,延迟800ms

    只能开播放一个 RTSP,能切换。 将 RTSP 转为 webRTC,,适用延迟精度要求较高的场所,这样只是使用了 webRTC 后台服务 而没有浏览器插件。 见案例 demo\htmlDemo\rtsp2WebRTC.html

    Var ReqPar= {"emit":"open","Obj":"rtsp2webRTC","AppShow":0,"AppFollow":0,"AppRuntime":1,"par": {"webRTC_cfg":webRTC_cfg,"pid":pid,"webRTC_dos":0,"AuthKey":pidAuthKey},"par0":{"f orce":1}}; AE_OpenApp(ReqPar );

    程序下载 

    程序名称   AppEmit.exe

    网址http://www.appemit.com

    Githubhttps://github.com/appemit/appemit

    Email联系 appemit(at)appemit.com  

    内容分发下载地址github下载地址

    相关文章

      网友评论

          本文标题:appemit支持chrome edge等浏览器播放rtsp r

          本文链接:https://www.haomeiwen.com/subject/sjvifltx.html