0

RTSP ビデオ ストリームとリモート コントロール プロトコルを提供するデバイスのリモート コントロールを実装しようとしています。Web ページに RTSP ビデオ ストリームを表示するにはどうすればよいですか?のサンプル コードから始めました。:

<OBJECT classid="clsid:9BE31822-FDAD-461B-AD51-BE1D1C159921"
     codebase="http://downloads.videolan.org/pub/videolan/vlc/latest/win32/axvlc.cab"
     width="640" height="480" id="vlc" events="True">
   <param name="Src" value="rtsp://cameraipaddress" />
   <param name="ShowDisplay" value="True" />
   <param name="AutoLoop" value="False" />
   <param name="AutoPlay" value="True" />
   <embed id="vlcEmb"  type="application/x-google-vlc-plugin" version="VideoLAN.VLCPlugin.2" autoplay="yes" loop="no" width="640" height="480"
     target="rtsp://cameraipaddress" ></embed>
</OBJECT>

次に、ページをクリックしたときにアラートを表示するHammer.jsのスニペットを追加しました。

var element = document.getElementById('test_el');
    var hammertime = Hammer(element).on("tap", function(event) {
        alert('hello!');
    });

VLC ActiveX コントロールの横をクリックするとアラートが表示されますが、上には表示されません。Hammer.js が表示する前に、ActiveX コントロールがタッチ イベントを消費していると思いますか? VLC の UI (一時停止/再生ボタン、ボリューム コントロールなど) をオフにして、タッチを消費しないようにする方法や、Hammer.js にタッチを表示させる方法はありますか? それとも私は完全に間違っていて、それは別の問題ですか?

4

1 に答える 1

0

VLC の例は少し古くなっていることがわかりました - WebPluginのドキュメントを参照してください。HTML を次のように更新できます。

<embed type="application/x-vlc-plugin" pluginspage="http://www.videolan.org"
     windowless="True"
     width="640"
     height="480"
     src="rtsp://192.168.0.10/screenmirror"
     id="vlc">
</embed>

重要なのは、次のように定義された「ウィンドウレス」フラグです。

Draw the video on a window-less (non-accelerated) surface and allow styling (CSS overlay, 3D transformations, and much more). Default: false

これを適用すると、VLC UI が消え、Hammer.js が正常に動作しているように見え、ビデオをクリックするとアラートが表示されます。

于 2013-09-15T06:47:22.687 に答える