海康摄像头chrome高版本实时播放（java集成）

实时播放（java集成）"/>

海康摄像头chrome高版本实时播放（java集成）

最近公司项目需要在web上实时播放摄像头视频。但是早前由于html发展太慢。浏览器不支持。各大视频厂商基本都是开发扩展插件来实现。但是目前各大浏览器都有安全机制，基本不允许额外安装插件等，百度了很多。很多都是基于ie，，使用active插件实现，而我们公司项目优化是基于谷歌，，，，而且不能使用插件（用户体验）。
所以整理一套。无需安装插件，在任意浏览器实时播放摄像头视频
正文：
部署nginx、ffmpeg转为rtmp、利用video.js播放，无需浏览器安装插件摄像头采用海康威视的
1、确认提供流是否能够播放：打开vlc播放器【媒体–》打开网络串流，输入流地址】。这里海康提供的rtsp流地址，
【rtsp://账号:密码@IP地址:554/1】【端口号默认554】
2、将nginx、ffmpeg 解压后放置d盘根目录。配置环境变量path：D:\ffmpeg\bin
相关文件地址：
3、启动nginx【运行文件中的exe文件，运行一闪之后任务管理器查看nginx.exe进程存在即可】，也可控制台启动nginx:

在浏览器输入http://localhost:8088/或者127.0.0.1:8088或者本机的IP地址，弹出如下页面表示搭建成功。
4、验证是否配置成功：cmd 输入ffmpeg 提示一大段话即可
5、cmd中输入
在cmd窗口中，打开nginx之后，输入命令ffmpeg -i “rtsp://admin:123456@192.168.2.165:554/1” -vcodec copy -acodec copy -f flv “rtmp://[此处可以用localhost,可以用127.0.0.1，也可以用本机ip]:1935/live/”,之后显示如下界面表示转码成功：

6、打开vcl播放器，播放rtmp://localhost/live，看看是否成功
视频如下：
这样转流步骤就完成了
7、RTMP视频播放web播放，html代码如下：

<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]><script src=".7.3/html5shiv.min.js"></script><script src=".4.2/respond.min.js"></script>
<![endif]--> 
<script src="../static/RTMP/adminlte-2.3.6/plugins/jQuery/jquery-2.2.3.min.js"></script>
<link rel="stylesheet" href="../static/RTMP/adminlte-2.3.6/plugins/video-js-5.19.2/video-js.css"/>
<script src="../static/RTMP/adminlte-2.3.6/plugins/video-js-5.19.2/video.js"></script>

            <div class="video-wrapper" style="padding-bottom:55%;position:relative;margin:0 auto;"><div class="video-inner" style="position:absolute;top:0;bottom:0;left:0;right:0;"><video id="videojs" class="video-js vjs-default-skin vjs-big-play-centered" style="width: 50%; height: 50%;" controls preload="none"poster="" x5-video-player-fullscreen=”true”，x5-video-player-type=”h5”><source src="rtmp://198.168.0.80:1935/hls/stream" type="rtmp/mp4"></source><p class="vjs-no-js">To view this video please enable JavaScript, and consider upgrading to a web browser that<a href="/" target="_blank">supports HTML5 video</a></p></video></div></div></div> <!-- wrapper--><script>videojs.options.flash.swf = '../static/RTMP/adminlte-2.3.6/plugins/video-js-5.19.2/video-js-fixed.swf';videojs.options.techOrder = ['html5','flash'];var player = null;             player = videojs("videojs",{notSupportedMessage : '您的浏览器没有安装或开启Flash,戳我开启！',techOrder : ["flash"],autoplay : true});player.on("error",function(e){var $e = $(".vjs-error .vjs-error-display .vjs-modal-dialog-content");var $a = $("<a href='' target='_blank'></a>").text($e.text());$e.empty().append($a);}); </script></section>
</div>