参考：https://my.oschina.net/yizhichao/blog/2967093
参考：https://blog.csdn.net/qq_21509637/article/details/81777693?utm_medium=distribute.pc_relevant.none-task-blog-BlogCommendFromMachineLearnPai2-1.channel_param&depth_1-utm_source=distribute.pc_relevant.none-task-blog-BlogCommendFromMachineLearnPai2-1.channel_param
注意点：需要32位的 vlc，进行时，需要视频转rtsp流
方法一：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<script>
</script>
</head>
<body>
<input type="text" name="url" value="" size="600"/>
<input type="button" name="播放" value="播放" onclick="play()"/>
<input type="button" name="停止" value="停止" onclick="stop()"/>
<div>
<OBJECT classid="clsid:9BE31822-FDAD-461B-AD51-BE1D1C159921" id="vlc" codebase="" width="600" height="480" id="vlc" events="True">
<param name="MRL" value="" />
<param name="Src" value="" />
<param name="AutoLoop" value="False" />
<param name="AutoPlay" value="False" />
<param name="Time" value="True" />
<param name="ShowDisplay" value="True" />
<param name="Controls" value="False">
<EMBED pluginspage="http://www.videolan.org" type="application/x-vlc-plugin" version="VideoLAN.VLCPlugin.2" width="600" height="480" text="Waiting for video" name="vlc"></EMBED>
</OBJECT>
</div>
</body>
<script type="text/javascript" >
function play()
{
var vlc = document.getElementById("vlc");
var rtspUrl=document.getElementById("url").value;
var options = new Array(":aspect-ratio=4:3", "--rtsp-tcp");
var id = vlc.playlist.add(rtspUrl, "fancy name", options);
vlc.playlist.playItem(id);
vlc.playlist.play();
}
function stop()
{
var vlc = document.getElementById("vlc");
vlc.playlist.stop();
}
</script>
</html>
方法二：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<script>
var itemId = 0;
function getVLC(name)
{
if (window.document[name])
{
return window.document[name];
}
if (navigator.appName.indexOf("Microsoft Internet")==-1)
{
if (document.embeds && document.embeds[name])
return document.embeds[name];
}
else
{
return document.getElementById(name);
}
}
function doGo(mrl)
{
var vlc = getVLC("vlc");
itemId=vlc.playlist.add(mrl);
vlc.playlist.playItem(itemId);
document.getElementById("btn_stop").disabled = false;
}
function updateVolume(deltaVol)
{
var vlc = getVLC("vlc");
vlc.audio.volume += deltaVol;
}
function doPlay()
{
vlc.playlist.playItem(itemId);
document.getElementById("btn_stop").disabled = false;
document.getElementById("btn_play").disabled = true;
}
function doStop()
{
getVLC("vlc").playlist.stop();
document.getElementById("btn_stop").disabled = true;
document.getElementById("btn_play").disabled = false;
}
</script>
</head>
<body>
<div style="margin: 50px">
<!-- <a title="rtsp://192.168.2.118:8554/vlc" href="<a target=_blank href="http://zzck-dental.com">http://zzck-dental.com</a>" onclick="doGo(this.title);return false;">本机的mp4文件</a> -->
<span style="margin: 20px;" />
<a title="rtsp://192.168.2.118:8554/vlc" href="#" onclick="doGo(this.title);return false;">实时视频流</a>
<span style="margin: 20px;" />
</div>
<div>
<OBJECT classid="clsid:9BE31822-FDAD-461B-AD51-BE1D1C159921" id="vlc"
codebase=""
width="600" height="480" id="vlc" events="True">
<param name="MRL" value="" />
<param name="Src" value="" />
<param name="ShowDisplay" value="True" />
<param name="AutoLoop" value="False" />
<param name="AutoPlay" value="False" />
<param name="Time" value="True"/>
<EMBED pluginspage="http://www.videolan.org"
type="application/x-vlc-plugin"
version="VideoLAN.VLCPlugin.2"
width="600"
height="480"
text="Waiting for video"
name="vlc"
></EMBED>
</OBJECT>
</div>
<div>
<input type=button id="btn_play" value=" 播放 " onClick='doPlay();' disabled="true">
<input type=button id="btn_stop" value="停止" onClick='doStop();' disabled="true">
<input type=button value="静音切换" onclick='getVLC("vlc").audio.togglemute();'>
<input type=button value="减小音量" onclick='updateVolume(-10)'>
<input type=button value="增加音量" onclick='updateVolume(+10)'>
</div>
</body>
</html>
网友评论