Red5とは
「Red5」は「Flash」クライアントで利用できるストリーミングのサーバとなります。
通常、「Flash」クライアントではAdobe社製品の「Flash Media Server」を利用するという方法がありますが、こちらは有償で費用も高くなるため、手軽に利用するには敷居が高くなります。
「Red5」はオープンソースのRTMPを利用したFlashサーバで、ビデオストリーミングやマルチユーザ利用を行えるJavaベースのサーバソリューションです。
★公式サイト
http://www.red5.org/
★日本Red5ユーザ会
http://www.red5.gr.jp/
ストリーミングとしては以下の音声・ビデオをサポートしています。
・FLV
・MP3
・F4V
・MP4
・AAC
・M4A
Red5のインストール
インストールのバージョンとしては現在のstableである、0.9.1を導入します。
# yum -y install java-1.6.0-openjdk java-1.6.0-openjdk-devel # cd /usr/local/src # wget http://trac.red5.org/downloads/0_9/red5-0.9.1.tar.gz # tar zxvf red5-0.9.1.tar.gz # mv ./red5-0.9.1 /usr/local/red5
起動スクリプトとしては以下サイトなどに、スクリプトが記載されておりますので、こちらご参考にしてください。
http://www.sohailriaz.com/downloads/red5.txt
起動スクリプトの設定を実施します。
# vi /etc/init.d/red5 先ほどのスクリプトなどを記載 # chmod 755 /etc/init.d/red5 # chkconfig --add red5 # chkconfig red5 on # /etc/init.d/red5 start
接続確認
Red5のインストール後は以下での確認を実施します。
「http://サーバドメイン:5080/」
すると、以下のような画面となります。
ここで、「Install」をクリックします。
すると以下の画面になります。
「oflaDemo」を選択して「Install」をクリックします。
また、トップページに戻り、今度は「demo」のリンクをクリックします。
「OFLA Demo」の「View demo」を選択してクリックします。
以下の画面でデモを開始します。
右上の部分ではインストールしたサーバのドメインを入れます。
そこで、「connect」を行い、左の「library」から動画を選択するとデモの動画がストリーミングで再生されます。
こちらでデモの動画の再生が行われます。
管理画面は「5080」で管理を行っていますが、RTMPで再生するためのポート番号(1935)は自動的に空いています。
5080はJavaで接続するためのポート番号となります。
こちらによりストリーミングの準備が完了いたしました。
HTMLからの確認
折角導入を行ってみたので、デモツールだけではなくHTMLからの接続を実施してみます。
確認にはFlashプレイヤーが必要ですので、オープンソースのFlashプレイヤーである、「FlowPlayer」を利用します。
「Red5」ではRTMPを利用するので、プラグインを導入しての確認を行います。
★FlowPlayerのダウンロード
★RTMPプラグインのダウンロード
http://flowplayer.org/plugins/streaming/rtmp.html
今回のタイミングで利用したプレイヤーやJavaScriptなどのファイルは以下になります。
・flowplayer-3.2.12.swf
・flowplayer.controls-3.2.12.swf
・flowplayer.rtmp-3.2.10.swf
・flowplayer-3.2.11.min.js
・ style.css
利用の際は、「README.txt」 や 「LICENSE.txt」 も確認してご利用ください。
今回は、すべて同一ディレクトリにおいて試験を行います。
そして同一ディレクトリに以下の「HTML」ファイルを保存します。
<html> <head> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <script type="text/javascript" src="flowplayer-3.2.11.min.js"></script> <link rel="stylesheet" type="text/css" href="style.css"> <title>Red5 TEST</title> </head> <body> <a style="display:block;width:320px;height:240px" id="rtmp_player" > </a> <script> flowplayer("rtmp_player","flowplayer-3.2.12.swf", { clip: { url : 'ファイル名(Flashファイルなど)', provider: 'rtmp' }, plugins: { rtmp: { url: 'flowplayer.rtmp-3.2.10.swf', netConnectionUrl: 'rtmp://サーバドメイン/oflaDemo' } } }); </script> </body> </html>
こちらで、先ほどあげたサンプルのストリーミングをHTMLへの埋め込みで確認することができます。