如何解决html播放rtsp视频,浏览器播放rtsp视频流方案

本文介绍: 支持协议：RTSP、RTMP、HLS、HTTP-FLV、We bSoc k e t-FLV、GB28181、HTTP-TS、WebSoc ket-TS、HTTP-fMP4、WebSoc ket-fMP4、MP4、WebRTC。要实现这个目的，可以采用的方案非常得多，有商业的也有开源的，这里主要列举一些开源的方案。-hls _wrap n:设置多少片之后开始覆盖，如果设置为0则不会覆盖，默认值为0.这个选项能够避免在磁盘上存储过多的片，而且能够限制写入磁盘的最多的片的数量。

最近项目中需要实时播放摄像头 rtsp 视频流，于是就专门做了些研究。而浏览器不能直接播放，只有通过插件或者转码来实现这个需求。

要实现这个目的，可以采用的方案非常得多，有商业的也有开源的，这里主要列举一些开源的方案。这里的方案都是我尝试过了的，有些成功，有些没成功。但是因为每个项目情况不同，这次没成的方法，换个项目也许就能成。

方案一: html5 + websocket _rtsp _proxy 实现视频流直播

实现步骤

服务器安装 strea median 服务器

客户端通过 video 标签播放

if (window.Streamedian) {
var errHandler = function(err){
console.log('err', err.message);

};

var infHandler = function(inf) {
console.log('info', inf)

};

var playerOptions = {
socket: "ws://localhost:8088/ws/",

redirectNativeMediaErrors : true,

bufferDuration: 30,

errorHandler: errHandler,

infoHandler: infHandler

};

var html5Player = document.getElementById("test_video");

html5Player.src = "rtsp://184.72.239.149/vod/mp4://BigBuckBunny_175k.mov";

var player = Streamedian.player('test_video', playerOptions);

window.onbeforeunload = function(){
player &amp;&amp; player.destroy();

player = null;

Request = null;

}

}

rtmp{
server{
listen 1935;

application live{
live on;

record off;

}

application hls{
live on;

hls on;

hls_path nginx-rtmp-module/hls;

hls_cleanup off;

}

}

}

video 播放

video
videojs.options.flash.swf = "./videojs/video-js.swf"

var player = videojs('test_video', {"autoplay":true});

player.play();

显示所有内容

声明：本站所有文章，如无特殊说明或标注，均为本站原创发布。任何个人或组织，在未征得本站同意时，禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益，可联系我们进行处理。

相关文章

发表回复 取消回复

发表回复取消回复