rtsp视频流如何在html上使用video模式播放？

rtsp视频流如何在html上使用video标签播放？

思路：利用VLC工具的流工具，进行服务器映射转码，得到video标签能够正常打开的ogg格式视频然后播放。

你需要：vlc工具，文本编辑器

首先是vlc配置：

1.打开VLC工具，选择 媒体→流，打开如下弹窗

2.选择tab中的网络，输入rtsp的URL（记得加上正确的帐号密码），然后点击串流

3.来源框会显示rtsp的url地址（带帐号不带密码的），这里不需要管，直接点击下一步

4.选择新目标HTTP，然后点击添加。

5.设置端口号，尽量避免与本地以后端口冲突。然后是路径，可以选择设置。点击下一个

6.选择Video - Theora + vorbis (OGG) ，这个视频格式能被video识别播放，点击下一个。

7.直接点击流即可。

上述完成了rtsp转码和映射的问题。接下来需要的是html播放。核心代码如下

<video src="http://localhost:9527/cc" id="myCamera" autoplay muted width="600" height="400"></video>
<script>
document.getElementById('myCamera').muted = false
</script>

chorme浏览器66之后就不能自动播放视频了，所有需要自动播放。chorme的做法是为了尽量不打扰用户，提高用户的体验感，他们允许视频静音之后自动播放（圈起来，这是考点，H5页面的背景音乐应该可以这么搞）。这里的js就是先静音，然后关闭静音。

上手测试之后，发现转码后的视频开始有段时间绿屏+花屏，过几秒就好了。不知道什么原因。