ヘロー。最近は事務職が板についてきました。個人的に気が進まない作業があるときの方がコーディングや検証に力が入るのはなんでだろう。学校のテスト前に部屋の掃除が捗る的な心理状態なのかな。
えーと、オーダーメイドでモニタリングツールを作ることがたまにあって、そのツールをWebSocket対応したのでそのときのメモとサンプルコードについて。



0. こんなの

作ったのはUI的にはこんなやつです。CassandraのPendingTaskの値をリアルタイムで表示する感じ。数値が一定以上いくと色を変える、みたいな。前はグラフ化したりしてたんだけど、今回の要件においては数値の方がわかりやすかったのでこうしてある。

3_ptask

1. 当初の実装

次の図のような感じで値を収集/描画していた。Ajaxで逐次問い合わせを行い、リクエストを受け付けたサーバ(Server)が後段にあるデータ収集対象ノード(node)のデータをかき集めて結果を表示してくれる。どうでもいいけど、フレームワークはbottleを使っていた(bottleイイ!(・∀・))。
  1. ブラウザがhtmlをダウンロード
  2. AjaxのポーリングでServerに問い合わせる
  3. Serverはリクエストを受けると、データ収集対象ノード(node)から欲しいデータを取得する
  4. Serverは取得したデータをブラウザに返す
1_bottle

この方式の問題点なんだけど、リアルタイム性を求めてポーリング間隔を短くしたり、収集対象ノードや取得するデータが増えるたりすると、ブラウザのリクエスト送出数がひどいことになってブラウザが悲鳴を上げる。あと、接続する人(ブラウザ)が増えると、最悪、収集対象ノードへの負荷にも繋がってしまう(自作ツールが原因で障害起こしちゃったらさすがに笑えねえ、いや逆に笑うしかねぇかw)。だったらリクエスト数を抑えるためにページングするなりしろって話だけど、やっぱ1ビューで全部見たいよね。

2. WebSocketで配信

で、WebSocketで配信するようにした。データの収集は、Collectorがデータ収集対象ノードを巡回して行う。収集したデータはServerに設えたAPIにHTTPで投げる。前はブラウザもServerもnodeもみんな頑張る必要があったんだけど、こうすれば頑張るのはServerだけで済む。閲覧者(ブラウザ)が増えても、nodeへの負荷が増加することもない。あと、bottleで作っていたServerをtornadoに鞍替えした。なんでかっつーと、tornadoでWebSocket張る方法は知っていたので。
  1. ブラウザがhtmlをダウンロード
  2. SeverとWebSocketを張る
  1. Collectorがデータ収集対象ノード(Server)を巡回して、取得したデータをtornadoにHTTPで投げる
  2. tornadoはWebSocketクライアント(WebBrowser)にプッシュする
2_tornado

3. サンプル

本ちゃんのブツはIPやら何やらをハードコーディングしちゃってるので晒すことができない。なので、おれのホームページにサンプルを仕込んだ。遊び方はサンプルページに書いてある。
ぎっはぶにも上げました。
 

 

 

 

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

Set your Twitter account name in your settings to use the TwitterBar Section.