RTMFPを使用したビデオチャットの実験

Tweet

ちょっと興味があったけどまだ手をつけきれていなかったFlashPlayer10.1の新機能「RTMFPマルチキャスト」を勉強ついでにやってみました。
今回デモで制作したのは「ローカルネットワーク上で動作するサーバレスのビデオチャット」です。

RTMFPビデオチャット（RTMFP Video Chat Example） – wonderfl build flash online

■ 使い方
1. 同じLAN上にある2台のWebカメラ付きPCでこのページを開きます。
2. Start ConnectをクリックするとFlashPlayerの設定パネルが開きますので「許可」をクリックします。上部のテキストエリアに”NetConnection.Connect.Success”が表示されれば接続成功です。
3. どちらか片方のPCでページ上部のBroadCastボタンを押し、カメラの使用を許可します。
4. うまくいけばもう片方のPCにBroadCastしたPCのカメラ映像が表示されます。
5. 先ほど受信した側のPCのBroadCastボタンを押すと双方向で映像と音声のやりとりが出来ます。
6. Massageのテキスト入力エリアにテキストを入力してSend Messageボタンを押すと相手にテキストを送信できます。

※ 1台のPCでもブラウザのウィンドウを2つ開けばとりあえず挙動の確認はできます。但し音声がダブって変なエコーがかかったようになりますが・・・

接続のためのコード（主要部分）は以下に。

Net Connectionを接続します

private function doConnect():void {
	_nc = new NetConnection();
	_nc.addEventListener(NetStatusEvent.NET_STATUS, netStatusHandler);
	_nc.connect("rtmfp:");
}

NetConnection.Connect.Successが呼ばれたらNetGroupインスタンスを作ります

private function addNetGroup():void{
	// GroupSpecifier
	_gs = new GroupSpecifier(グループ識別子);
	_gs.postingEnabled = true;
	_gs.ipMulticastMemberUpdatesEnabled = true;
	_gs.multicastEnabled = true;
	_gs.addIPMulticastAddress(マルチキャストに使用するアドレス);
	// NetGroup
	_ng = new NetGroup(_nc, _gs.groupspecWithAuthorizations());
	_ng.addEventListener(NetStatusEvent.NET_STATUS, netStatusHandler);
} 

NetGroup.Connect.Successが呼ばれたら送信用NetStreamを確立してカメラインスタンスを割り当てます。

private function broadCast(e:MouseEvent):void {
	// NetStream
	_ns = new NetStream(_nc, _gs.groupspecWithAuthorizations());
	_ns.addEventListener(NetStatusEvent.NET_STATUS, netStatusHandler);
	setUpCamera()
	_ns.attachCamera(_cam);
	_ns.publish(_streamName);
}

あとは、受信用のNetStreamを作りVideoインスタンスにストリームを割り当てると表示できます。
またチャット部分は今回は NetGroup.post(Object); を送受信しています。

Tweet