読者です 読者をやめる 読者になる 読者になる

Node.jsのSocket.IO+WebRTCでP2Pの動画チャットを作ってみた。

WebRTCでP2Pを実現しようとすると、ブラウザ1とサーバとブラウザ2の間でリアルタイムな通信を必要とするので、node.jsのWebSocket(Socket.IO)で実装してみた。
最初のページを静的なHTMLで作ったのとDBを使ってないので、
たぶん公式に載ってるデモより混乱しないと思う。

ローカルで2つのブラウザを立ち上げて試すと、うまく動作します。
だけど、リモートで試すとストリームがみつからないみたいでうまく動かない。
blobをやりとりしている部分をもう少し追う必要がありそう。

ソースコード(github)

今回は、少し大きくなったので、githubに公開しました。(と言っても、実質2ファイルです)
https://github.com/yutaka-m/node-webrtc-chat

以下の手順で起動すれば、うまく動作すると思います。

node.jsをインストール
# aptitude install g++
# aptitude install libssl-dev
# mkdir src
# cd src/
# wget http://nodejs.org/dist/v0.6.14/node-v0.6.14.tar.gz
# tar zxvf node-v0.6.14.tar.gz 
# cd node-v0.6.14/
# configure
# make
# make install

npmをインストール
# curl http://npmjs.org/install.sh | sh

アプリをインストール
# git clone git://github.com/yutaka-m/node-webrtc-chat.git
# cd node-webrtc-chat
# npm install
# node app.js

http://localhost:3001/ にアクセスする。

デモ

面倒くさい人用にデモサイトも作りました。

ChromeのDev ChannelとBataで動作確認しています。

http://alumican.jp:3001/

使い方

1.ブラウザを2つ立ち上げる
 (以下、ブラウザAとブラウザBと呼称)
2.ブラウザAの「Generate Room key」ボタンを押し、Room keyを生成する。(手入力でも可)
3.ブラウザAの「Connect」ボタンを押す。
4.ブラウザAの「Room key」をブラウザBの「Room key」にコピー&ペーストする。
5.ブラウザBの「Connect」ボタンを押す。
6.ブラウザAとブラウザBのステータスがEstablished.になったら完了。

余談

node.jsのアプリケーションは、ポートを占有するしちゃうんだけど、
複数アプリケーションを動作させる時はみんなどうしてるんだろう。
apacheプロクシにするとwebsocketで性能が劣化しそうだし悩ましい。