昨日、ServersMan@VPSにpywebsocketをインストールしたのですが、今回、websocket-sampleに含まれているlitechatというサンプルを実際に動かしてみました。

litechatサンプルはこちらになります。

元々のlitechatサンプルのサーバ側のカスタマイズ内容は下記の通りとなっています。フロント部分は見ていないのですいません。分かりません。フロント部分の実装には@smegdheadさんに助けてもらいました。ありがとうございました。

• 初期表示時に過去ログをすべて表示
• XSS対策としてHTMLエスケープを行っている。

これだけのリアルタイム性のあるWEBアプリがHTML含めて100行未満（JavaScriptだけだと50行ほど）で作成できるなんてWebSocket素晴らしいです！サンプルページにサーバ側のソースもそのうちアップしたいと思います。XSS攻撃対策のために、タグはすべて使用不可にしていますが、今後装飾系のタグのみ使用できるようにカスタマイズしていきたいと思います。

メインで使用しているブラウザのChromeには既にWebsocketが実装されており、使用することが可能だということで、簡易的なチャットでも作ってみようかと思い、色々調べていました。

Jetty7でWebSocket開発：マピオンラボ(Java)

サーバ側の実装についてまとめられています。今回私が選択したのは、pywebsocketというものです。これは、apacheのモジュールとして提供されwsプロトコルの場合はwebsocketハンドラに処理を流すというものです。スタンドアロンで使用することもできるらしいのですが、今回はapacheのモジュールとして使用します。pywebsocketという名前からwebsocketハンドラはプログラム言語Pythonで実装する必要があります。

インストールした環境は、ServersMan@VPSでOSはCentOs 5.4です。それでは、早速手順の方を書いていきたいと思います。

手順は以下から

概要

ServersMan@VPS上にapacheのwebsocket

前提条件

• 環境はServersMan@VPSのEntryプランのものを使用する。
• yumにてhttpdをインストール済みとする。
• 下記の手順はユーザ「root」にて行うこと。
• ダウンロードなどの作業ディレクトリは「/root/tmp」とする。

作業手順

python-develのインストール

mod_pythonをコンパイルする際にPythonのソースが必要な為インストールする。

ダウンロード、インストール

# wget ftp://mirror.switch.ch/pool/3/mirror/centos/5.5/os/x86_64/CentOS/python-devel-2.4.3-27.el5.i386.rpm
# rpm -ivh python-devel-2.4.3-27.el5.i386.rpm

上記のダウンロードURLの接続が悪い場合などは、下記のサイトから他のミラーサイトのURLを使用する。
RPM Search CentOS 5 python-devel-2.4.3-27.el5.i386.rpm

mod_pythonのインストール

Issue 42 – pywebsocket – Python2.4 Support (CentOS/RHEL) – Project Hosting on Google Code

mod_python自体はyumでもインストールすることは可能だが、バージョンが3.2.xであり、pywebsocketはmod_pythonの3.3より低いバージョンはサポートしていない為ソースからコンパイルする。

ダウンロード、インストール

# wget https://ftp.kddilabs.jp/infosystems/apache/httpd/modpython/mod_python-3.3.1.tgz
# tar zxf mod_python-3.3.1.tgz
# cd mod_python-3.3.1
# ./configure –with-apxs=/usr/sbin/apxs –with-python=/usr/bin/python
# make
# make install

python.confの作成
ファイルパス：/etc/httpd/conf.d/python.conf
ファイル内容

LoadModule python_module modules/mod_python.so
AddHandler mod_python .py

pywebsocketのインストール

svnのtrunkを使用しても良いが、安定している可能性が高いバージョンが区切られたものを今回は使用する。今回使用したwebsocketの本家サイトをチェックし、バージョン0.5よりも新しいものがリリースされている場合は、できる限りそちらを使った方が良い。ただし、正常にインストールできるかは保証しない。

ダウンロード、インストール

# wget https://pywebsocket.googlecode.com/files/mod_pywebsocket-0.5.tar.gz
# tar zxf mod_pywebsocket-0.5.tar.gz
# cd pywebsocket-0.5/src
# python setup.py build
# python setup.py install

# python setup.py install

を実行した際にインストールされたディレクトリが出力されるのでメモを取る。今回は下記のディレクトリ。

/usr/lib/python2.4/site-packages/

python_mod_pywebsocket.confの作成
ファイルパス：/etc/httpd/conf.d/python_mod_pywebsocket.conf
ファイル内容

<IfModule python_module>
PythonPath “sys.path+[‘/usr/lib/python2.4/site-packages/’]”
PythonOption mod_pywebsocket.handler_root /var/www/html/wsh
PythonHeaderParserHandler mod_pywebsocket.headerparserhandler
</IfModule>

設定値の説明は下記の通り。

PythonPath “sys.path+[‘/usr/lib/python2.4/site-packages/’]”

pywebsocketがインストールされているディレクトリパス。

PythonOption mod_pywebsocket.handler_root /var/www/html/wsh

websocketハンドラを格納されているディレクトリ

pywebsocketの反映

インストールしたpywebsocketを反映させる為にapacheを再起動する。

# /etc/init.d/httpd restart

サンプルの配置・動作確認

上記でダウンロードしたpywebsocketにはサンプルが含まれているので、それが正常に動作するか動作確認を行う。

サンプルの配置

# cd pywebsocket-0.5/src/example
# cp echo_wsh.py /var/www/html/wsh/

動作確認

# python echo_client.py -s localhost -r /echo
Send: Hello
Recv: Hello
Send: 日本
Recv: 日本
Closing handshake
# python echo_client.py -s localhost -r /echo -m ‘hoge’,’foo’
Send: hoge
Recv: hoge
Send: foo
Recv: foo
Closing handshake

補足

websocketハンドラファイルの命名規則

PythonOption mod_pywebsocket.handler_root /var/www/html/wsh

上記で設定したmod_pywebsocket.handler_rootから下記のような命名規則でハンドラが実行されます。

[{ディレクトリパス}]{リソース名}_wsh.py

サンプル
アクセスURI：ws://localhost:80/echo
実行されるハンドラパス：/var/www/html/wsh/echo_wsh.py

アクセスURI：ws://localhost:80/chat/echo
実行されるハンドラパス：/var/www/html/wsh/chat/echo_wsh.py