web-dev-qa-db-ja.com

HTMLページにVLCプラグインを埋め込む

私はhtmlファイルを持っています(getStream.html)特定のURLからストリームを取得して表示します。コードは次のとおりです。

<!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>

私のPCにこのページがあり、それを開こうとすると(IE 7/8/9を使用)、すべて正常に機能しますが、このページをサーバーに配置すると、このようなURLから:http://myserver/direcortyOfMyhtmlFile/getStream.html

ページが開かれ、ボタンが読み込まれますが、次のエラーが発生します。

iE8およびIE9の場合: error in IE9, IE8

英語では、「プロパティ 'add'の値を取得できません:オブジェクトがnullまたは定義されていません」のようになります。

IE7の場合: enter image description here

これらのエラーは私のhtmlのオブジェクトを参照しているようですが、同じページがローカルで問題なく機能するため、これは私には奇妙です。

4
GVillani82

残念ながら、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.

これは基本的に、それを機能させる方法を見つけたとしても、IEであなたのサイトでビデオを見ようとする人は、それを機能させるためにVLCプレーヤープログラム全体をダウンロードしてインストールする必要があることを意味しますIEで、ユーザーはおそらくそれを望んでいません。ビデオアドレスを正しく入力していなかったかもしれませんが、FirefoxまたはIE8でボーイフレンドのコンピューターでコードを動作させることができません...ビデオ出力がないことについてのメッセージ...

推測して、VLCがインストールされているので、おそらくローカルで機能すると言いますが、サーバーは機能しません。残念ながら、おそらくWindows Media Playerまたは同様のものを使用する必要があります(Microsoftは、人々に自分のものを使用させるのが得意です!)

そして、疑問に思っているのであれば、cabファイルがない理由は、ActiveXコントロールに署名するためのコストが原因であるように思われます。

あなたのページでFirefoxとchromeユーザー用にVLCを使用し、IEユーザー用にWindowsMedia Playerを使用するのは、それがうまくいくのであれば、かなり簡単です。

1
Kat Cox

私はこのコードをウェブのどこかで見つけました。多分それはあなたを助け、私はあなたにこれまでのところ私が同じ目的のためにそれを収容した更新を与えます...多分私は....誰が知っているのか...ここにすべてのnogoddersとdobeddersがいます:-/

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()
}
}
}
}
};

IEでも動作しませんでした... 2b続き...

挨拶

ジー

1
user3300331