VLC插件

最近项目用到需要在浏览器上播放视频流，尝试了很多种方式去解决，包括使用ffmpeg转码成rtmp播放，websocket结合webrtc等方式，但是效果都不是很好，而且存在一定的丢包和搭设的复杂度，对于我们只是想简单实现直播播放效果的，能怎么容易怎么容易是吧，由于html的video标签并不能直接播放rtsp直播流，所以我们只要借助其他的工具来实现，本文主要是自己通过vlc插件来显示rtsp流视频的案例，仅供参考。

局限和问题

搜索过网上资料，大家应该都知道VLC插件能够在浏览器中播放rtsp,但是多数文章都是很早的案例，且很多兼容性存在很大问题，插件目前只支持ie，像chrome在46版本之后根本就无法使用。

效果图

测试环境

浏览器版本 IE 11，VLC插件版本 vlc-1.0.5-win32，如果是高版本的你会发现所有浏览器你的VLC要不不支持，要么就是一片空白不显示。
因为版本比较低，找不到的或者没有的可以下载这个 vlc-1.0.5-win32.，现在上传文件都要积分的吗==尴尬

rtsp测试地址

rtsp这里提供一个可测试的地址，rtsp://184.72.239.149/vod/mp4://BigBuckBunny_175k.mov
打开VLC播放视频验证是否可以播放，打开播放器，选择菜单中“媒体”->“打开网络串流…”。在弹出页面中填入视频地址即可。也可以直接上代码，不出意外即可看到画面。

上代码

以下是我html页面的代码：结合网上的案例，只要对地址稍加修改即可。如对页面有要求的，可自行结合js拓展功能。

<!DOCTYPE html>
<html lang="en" dir="ltr"><head><meta charset="utf-8"><title></title>
</head>
<body>
<object type='application/x-vlc-plugin' id='vlc' events='True'classid='clsid:9BE31822-FDAD-461B-AD51-BE1D1C159921' codebase="http://downloads.videolan.org/pub/videolan/vlc/latest/win32/axvlc.cab" width="720" height="540"><param name='mrl' value='写上你自己的rtsp地址' /><param name='volume' value='50' /><param name='autoplay' value='true' /><param name='loop' value='false' /><param name='fullscreen' value='false' />
</object>
</body></html>

在这里就实现了简单的浏览器播放rtsp视频直播流，但是会发现，视频存在一定的延迟，这也是后续需要优化的地方。本案例主要环境是在IE下，版本11，火狐和谷歌的高版本我测试过是不可以的，如果你们的项目有对浏览器有特殊的要求，就需要用其他方案了，当然如果大家有更好的兼容性解决方案可以告诉我，一起学习进步。

转载请保留原文链接。本文内容均为实践后的学习整理。

VLC插件在浏览器下（IE11）实现播放rtsp视频直播流相关推荐

Unity3D下Linux平台播放RTSP或RTMP流
背景尽管Windows平台有诸多优势,Linux平台的发展还是势不可挡,特别实在传统行业,然而Linux生态构建,总是差点意思,特别是有些常用的组件,本文基于已有的Linux平台RTSP.RTMP播 ...
音视频开发（16）---海康IPC+NVR+EasyDarwin+EasyPusher+VLC实现Web实时播放RTSP视频
海康IPC+NVR+EasyDarwin+EasyPusher+VLC实现Web实时播放RTSP视频用ffmpeg+nginx实现web播放rtsp视频,原理是将rtsp转码成rtmp格式,再用fl ...
php安卓直播抓取,hls,android_安卓大部分浏览器播放HLS协议直播流会从头开始，hls,android,ffmpeg,m3u8 - phpStudy...
安卓大部分浏览器播放HLS协议直播流会从头开始遇到的问题 HLS直播流在iOS系统中表现正常, 但在安卓使用大部分浏览器(UC浏览器除外)播放ffmpeg生成的HLS直播流都会发生从头播放的问题, ...
浏览器播放rtsp视频，基于nodeJs
浏览器播放rtsp视频,基于nodeJs 1:安装ffmpeg,并且配置环境变量. 下载地址:http://ffmpeg.zeranoe.com/builds/ 或者: 百度云链接:https://p ...
网页播放rtsp视频解决方案（unity webplayer页面播放遮挡问题解决方案）
1.vlc activeX播放安装vlc-2.2.8.0.exe,勾选ActiveX插件,使用插件播放rtsp视频: 在unity webplayer页面播放有遮挡问题,解决方案如下: <di ...
配置nginx，使其可以以https的方式播放http-flv的直播流
一.背景由于在微信小程序中需要https的接入,所以要想在微信小程序中播放http-flv的直播流可能需要以https的方式.下面讲述如何配置nginx,使其可以以https的方式播放http-fl ...
魔坊APP项目-27-直播、客户端中调整窗口大小、能播放rtmp格式直播流的播放器模块
直播客户端中直播的界面调整和当前窗口一致 live_list.html <!DOCTYPE html> <html lang="en"> <head ...
Python Gstreamer播放rtsp视频（含音频）（海康IPCAM）
Python Gstreamer播放rtsp视频(海康IPCAM) 播放思路详见博客:Python Gstreamer播放rtsp视频流(海康IPCAM) 元件连接图解: 这里开始想使用tee分流 ...
Vue中使用can-autoplay插件实现浏览器不支持自动播放音频时提示点击
场景 Vue中使用speak-tts插件实现点击按钮后进行语音播报(TTS/文字转语音): Vue中使用speak-tts插件实现点击按钮后进行语音播报(TTS/文字转语音)_BADAO_LIUMAN ...

VLC插件在浏览器下（IE11）实现播放rtsp视频直播流

VLC插件

局限和问题

效果图

测试环境

rtsp测试地址

上代码

VLC插件在浏览器下（IE11）实现播放rtsp视频直播流相关推荐

最新文章

热门文章