Question

我有一个html文件（getStream.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 content="text/html; charset=utf-8" http-equiv="Content-Type" />
    <title>Vids</title>
    <link href="main.css" rel="stylesheet" type="text/css" />
</head>

<body onload='player("http://mystreamaddress:8080");'>

<div id="player">
    <object type="application/x-vlc-plugin" 
      id="vlcplayer" 
      width="864px"
      height="540px" 
      classid="clsid:9BE31822-FDAD-461B-AD51-BE1D1C159921">  
      <param name="Volume" value="100" />
      <param name="AutoPlay" value="true" />
      <param name="AutoLoop" value="false" />
    </object>
</div>

<div id="controls">
  <input type="button" onclick="play();" value="Play" />
  <input type="button" onclick="pause();" value="Pause" />
  <input type="button" onclick="stop();" value="Stop" />
  <input type="button" onclick="mute();" value="Mute" />
</div>

<script type="text/javascript" language="javascript">
    var vlc = document.getElementById("vlcplayer");
    function player(vid) {
    try {
        var options = new Array(":aspect-ratio=16:10", "--rtsp-tcp", ":no-video-title-show");
      var id = vlc.playlist.add(vid,'Video',options);
      vlc.playlist.playItem(id);
      vlc.video.fullscreen = true;
      //vlc.video.toggleFullscreen();
    }
    catch (ex) {
      alert(ex);
    }
    }       
    function mute(){
    vlc.audio.toggleMute();
  }

    function play(){
    vlc.playlist.play();
  }

    function stop(){
    vlc.playlist.stop();
  }

    function pause(){ 
    vlc.playlist.togglePause();
  } 

  function fullscreen(){
    vlc.video.toggleFullscreen();
  }

</script>

</body>

</html>

如果我在我的电脑上有这个页面，我尝试打开它（使用IE 7/8/9），一切正常，但是如果把这个页面放在我的服务器上，然后我从这样的网址访问它：http://myserver/direcortyOfMyhtmlFile/getStream.html

打开页面并加载按钮，但是我收到以下错误：

在IE8和IE9中

： error in IE9, IE8

在英语中应该是这样的：“不可能获得属性的值'添加'：对象为null或未定义”

在IE7中： enter image description here

这些错误似乎是指我的html中的对象，但这对我来说很奇怪，因为同一页面本地没有问题。

Answer 1

test.html对如何使用VLC WebAPI很有帮助。

test.html位于安装VLC的目录中。

例如 C:\Program Files (x86)\VideoLAN\VLC\sdk\activex\test.html

以下代码是test.html的引用。

<强> HTML：

<object classid="clsid:9BE31822-FDAD-461B-AD51-BE1D1C159921" width="640" height="360" id="vlc" events="True">
  <param name="MRL" value="" />
  <param name="ShowDisplay" value="True" />
  <param name="AutoLoop" value="False" />
  <param name="AutoPlay" value="False" />
  <param name="Volume" value="50" />
  <param name="toolbar" value="true" />
  <param name="StartTime" value="0" />
  <EMBED pluginspage="http://www.videolan.org"
    type="application/x-vlc-plugin"
    version="VideoLAN.VLCPlugin.2"
    width="640"
    height="360"
    toolbar="true"
    loop="false"
    text="Waiting for video"
    name="vlc">
  </EMBED>
</object>

<强> JavaScript的：

您可以从getVLC()获取vlc对象它适用于IE 10和Chrome。

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 // if (navigator.appName.indexOf("Microsoft Internet")!=-1)
    {
        return document.getElementById(name);
    }
}

var vlc = getVLC("vlc");

// do something.
// e.g. vlc.playlist.play();

Answer 2

我发现了这个：

<embed type="application/x-vlc-plugin"
pluginspage="http://www.videolan.org"version="VideoLAN.VLCPlugin.2"  width="100%"        
height="100%" id="vlc" loop="yes"autoplay="yes" target="http://10.1.2.201:8000/"></embed>

我没有在你的代码中看到任何地方....我认为这就是你所需要的，目标就是你视频的位置......

以下是vlc插件的更多信息：
http://wiki.videolan.org/Documentation%3aWebPlugin#Input_object

要检查的另一件事是视频文件的地址是正确的....

Answer 3

不幸的是，IE和VLC现在还没有真正起作用......我在vlc论坛上发现了这个：

VLC included activex support up until version 0.8.6, I believe. At that time, you could
access a cab on the videolan and therefore 'automatic' installation into IE and Firefox
family browsers was fine. Thereafter support for activex seemed to stop; no cab, no
activex component.

VLC 1.0.* once again contains activex support, and that's brilliant. A good decision in
my opinion. What's lacking is a cab installer for the latest version.

这基本上意味着即使你找到了一种方法让它工作，任何试图在你的网站上查看视频的人都必须下载并安装整个VLC播放器程序才能让它在IE中工作，而用户可能不想那样做。我无法让你的代码在我的男朋友电脑上使用firefox或IE8，虽然我可能没有正确地放置视频地址......我得到一些关于没有视频输出的消息......

我会猜测并说它可能适合您本地因为您安装了VLC，但您的服务器没有。不幸的是，你可能不得不使用Windows媒体播放器或类似的东西（微软非常擅长强迫人们使用他们的东西！）

如果您想知道，似乎没有cab文件的原因是因为签署了active-x控件的成本。

让你的页面使用VLC用于firefox和chrome用户以及用于IE用户的Windows Media Player是相当简单的，如果这对你有用。

Answer 4

我在网络的某个地方找到了这段代码。也许它可以帮助你和我给你一个更新到目前为止我为了相同的目的容纳它...也许我不....谁知道...谁在这里所有的nogodders和dobedders： - / < / p>

function runVLC(target, stream)
{
var support=true
var addr='rtsp://' + window.location.hostname + stream
if ($.browser.msie){
$(target).html('<object type = "application/x-vlc-plugin"' + 'version =  
"VideoLAN.VLCPlugin.2"' + 'classid = "clsid:9BE31822-FDAD-461B-AD51-BE1D1C159921"' + 
'events = "true"' + 'id = "vlc"></object>')
}
else if ($.browser.mozilla || $.browser.webkit){
$(target).html('<embed type = "application/x-vlc-plugin"' + 'class="vlc_plugin"' + 
'pluginspage="http://www.videolan.org"' + 'version="VideoLAN.VLCPlugin.2" ' + 
'width="660" height="372"' + 
'id="vlc"' + 'autoplay="true"' + 'allowfullscreen="false"' + 'windowless="true"' + 
'mute="false"' + 'loop="true"' + '<toolbar="false"' + 'bgcolor="#111111"' + 
'branding="false"' + 'controls="false"' + 'aspectRatio="16:9"' + 
'target="whatever.mp4"></embed>')
}
else{
support=false
$(target).empty().html('<div id = "dialog_error">Error: browser not supported!</div>')
}
if (support){
var vlc = document.getElementById('vlc')
if (vlc){
var opt = new Array(':network-caching=300')
try{
var id = vlc.playlist.add(addr, '', opt)
vlc.playlist.playItem(id)
}
catch (e){
$(target).empty().html('<div id = "dialog_error">Error: ' + e + '<br>URL: ' + addr + 
'</div>')
}
}
}
}
/* $(target + ' object').css({'width': '100%', 'height': '100%'}) */

迎接

吉

我现在将整个废话减少到：

function runvlc(){
var target=$('body')
var error=$('#dialog_error')
var support=true
var addr='rtsp://../html/media/video/TESTCARD.MP4'
if (navigator.userAgent.toLowerCase().indexOf("msie")!=-1){
target.append('<object type = "application/x-vlc-plugin"' + 'version = "
VideoLAN.VLCPlugin.2"' + 'classid = "clsid:9BE31822-FDAD-461B-AD51-BE1D1C159921"' + 
'events = "true"' + 'id = "vlc"></object>')
}
else if (navigator.userAgent.toLowerCase().indexOf("msie")==-1){
target.append('<embed type = "application/x-vlc-plugin"' + 'class="vlc_plugin"' + 
'pluginspage="http://www.videolan.org"' + 'version="VideoLAN.VLCPlugin.2" ' + 
'width="660" height="372"' + 
'id="vlc"' + 'autoplay="true"' + 'allowfullscreen="false"' + 'windowless="true"' + 
'mute="false"' + 'loop="true"' + '<toolbar="false"' + 'bgcolor="#111111"' + 
'branding="false"' + 
'controls="false"' + 'aspectRatio="16:9"' + 'target="whatever.mp4">
</embed>')
}
else{
support=false
error.empty().html('Error: browser not supported!')
error.show()
if (support){
var vlc=document.getElementById('vlc')
if (vlc){
var options=new Array(':network-caching=300') /* set additional vlc--options */
try{ /* error handling */
var id = vlc.playlist.add(addr,'',options)
vlc.playlist.playItem(id)
}
catch (e){
error.empty().html('Error: ' + e + '<br>URL: ' + addr + '')
error.show()
}
}
}
}
};

没有让它工作，即... 2b继续......

迎接

吉

在HTML页面上嵌入VLC插件

4 个答案: