動画ファイル埋め込み(ストリーミング配信) の変更点

追加された行はこの色です。
削除された行はこの色です。
動画ファイル埋め込み(ストリーミング配信) へ行く。
** 動画ファイル埋め込み(HTML/JavaScript) [#j62413c6]
** 動画ファイル埋め込み(ストリーミング配信) [#j62413c6]
#setlinebreak(on);

ストリーミング配信を行う場合に、動画ファイルをWEBページに埋め込む方法を記述する。
以下では、RealPlayer用の動画ファイル(拡張子rm)を、WEBページに埋め込んだRealPlayerで再生する為の方法を記載する。
また、ストリーミング配信を前提とする為、プログレッシブダウンロードする場合の説明については記述していない。
※配信にはストリーミングサーバが必要である。⇒ [[ｽﾄﾘｰﾐﾝｸﾞｻｰﾊﾞ構築]]

【構成 および ファイル配置】
|配置するサーバ|ファイル|ファイル説明|h
|WEBサーバ|HTML|WEBページ上から再生できるようにRealPlayerを埋め込んだもの|
|~|メタファイル|ストリーミングサーバ上の動画ファイルへのPATHを記したもの|
|ストリーミングサーバ|動画ファイル|実際に再生する動画ファイル|

　※各ファイルの参照関係
　 [HTML] -> [メタファイル] -> [動画ファイル]
~

【ファイルの記述、配置】
　１．動画ファイルの設置
　　・動画ファイルをストリーミングサーバに設置する。
|ファイル名|設置場所|説明|h
|sample.rm|ストリーミングサーバの動画設置用ディレクトリ&br;(例)/usr/local/movies/sample.rm|rtsp://my_stream_server/sample.rm でアクセス可能な事|h
~

　２．メタファイルの記述、および設置
　　・下記のようにメタファイル(sample)を作成、設置する
|ファイル名|設置場所|ファイル内容|h
|sample.ram|WEBサーバの公開ディレクトリ以下&br;(例) http&#58;//my_web_server/sample.ram|rtsp://my_stream_server/sample.rm|h

　　【動画ファイルの種類による設定の違い】
|動画ファイルの拡張子|メタファイル拡張子|メタファイル記述例|h
|rm|ram|rtsp://サーバー名/パス/音声・動画ファイル名.rm|
|wmv|wvx|<asx version="3.0">&br;&nbsp;&nbsp;&nbsp;&nbsp;<entry>&br;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<ref href="mms://サーバー名/パス/音声・動画ファイル名.wmv" />&br;&nbsp;&nbsp;&nbsp;&nbsp;</entry>&br;</asx>|
|asf|asx|<asx version="3.0">&br;&nbsp;&nbsp;&nbsp;&nbsp;<entry>&br;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<ref href="mms://サーバー名/パス/音声・動画ファイル名.asf" />&br;&nbsp;&nbsp;&nbsp;&nbsp;</entry>&br;</asx>|
~

　３．HTMLファイルの記述、および設置
|ファイル名|設置場所|ファイル内容|h
|sample_rm.html|WEBサーバの公開ディレクトリ以下&br;(例) http&#58;//my_web_server/sample_rm.html|&lt;html&gt;&br;&lt;body&gt;&br;&br;&lt;h3&gt;WEBページにRealPlayerを埋め込んでのストリーミング配信サンプル&lt;/h3&gt;&br;&lt;!-- 動画表示領域 --&gt;&br;&lt;object id="Clip1" classid="clsid:CFCDAA03-8BE4-11cf-B84B-0020AFBBCCFA" width="350" height="280"&gt;&br;&nbsp;&lt;param name="controls" value="ImageWindow"&gt;&br;&nbsp;&lt;param name="console" value="Clip1"&gt;&br;&nbsp;&lt;param name="autostart" value="true"&gt;&br;&nbsp;&lt;param name="maintainaspect" value="true"&gt;&br;&nbsp;&lt;param name="nojava" value="true"&gt;&br;&nbsp;&lt;param name="src" value="http&#58;//my_web_server/sample.ram"&gt;&br;&nbsp;&lt;embed type="audio/x-pn-realaudio-plugin" width="350" height="280" nojava="true" console="Clip1" controls="ImageWindow" autostart="true" pluginspage="http&#58;//www.real.com/player/index.html"&gt;&br;&nbsp;&lt;/embed&gt;&br;&lt;/object&gt;&br;&lt;br&gt;&br;&lt;!-- コントロールパネル領域 --&gt;&br;&lt;object id="Clip1-ctr" classid="clsid:CFCDAA03-8BE4-11cf-B84B-0020AFBBCCFA" width="350" height="30"&gt;&br;&nbsp;&lt;param name="src" value="http&#58;//my_web_server/sample.ram"&gt;&br;&nbsp;&lt;param name="controls" value="ControlPanel"&gt;&br;&nbsp;&lt;param name="autostart" value="true"&gt;&br;&nbsp;&lt;param name="console" value="Clip1"&gt;&br;&nbsp;&lt;param name="nojava" value="true"&gt;&br;&nbsp;&lt;embed type="audio/x-pn-realaudio-plugin"  width="350" height="30" pluginspage="http&#58;//www.real.com/player/index.html" controls="ControlPanel" autostart="true" console="Clip1" nolabels="true" nojava="true"&gt;&br;&nbsp;&lt;/embed&gt;&br;&lt;/object&gt;&br;&br;&br;&lt;/body&gt;&br;&lt;/html&gt;|h

　　※コントロールパネル領域を表示する場合は、動画表示領域用とは別にobject要素を定義する必要がある。
　　※Media Player や QuickTime をページに埋め込むことも可能。
~

【動作確認】
　・ http&#58;//my_web_server/sample_rm.html にアクセスして動画が再生されればＯＫ。
#html(<table><tr><td width="20"></td><td style="border:1px solid #000000">)
&ref(streaming_test00.jpg,nolink);
#html(</td></tr></table>)
動画ファイル埋め込み(ストリーミング配信) の変更点 - 闘うITエンジニアの覚え書き
