素人がプログラミングを勉強していたブログ

プログラミング、セキュリティ、英語、Webなどのブログ since 2008

連絡先: すかいぷ:javascripter_  か javascripter あっと tsukkun.net skypeのほうがいいです

Comet通信について(キャンプで書いたコードの一部の紹介)

キャンプ4日目に、グループ実習で通信対戦型のテトリスを作ろうという話になって、僕がクライアント側のJavaScriptのコードをだいたい書いて、id:qnighyRubyでサーバー側のComet通信の部分を担当する、といったことをしてた。

Comet通信もこの時初めて知って、クライアントとCGIを常に繋ぎっぱなしにして、CGI側が必要になった時リクエストを切って、情報を渡す。情報を受けとったらすぐリクエストを投げて繋ぎっぱなしにする。といった感じで通信を行なう。ということをした。

JavaScript側のComet通信の一部のコードも掲載してみる。最新のコードをgitから落してくるのを忘れたので、このままでは動かないけど、ロジックはこんな感じ、といったことで。
やってることは、クライアント側がしばらくリクエストが帰ってこないと勝手に切っちゃうので、CGI側が10秒程度で一旦、jsonで

{
  "state" : "timeout"
}

という文字列を返したり、
相手側のテトリスのMapの中継をCGIが担当して、JavaScript側で受けとった配列をcanvasに描く、といった感じ。
具体的なコードは下。

(function comet() {
  var xhr = new XMLHttpRequest();
  xhr.onload = function() {
    try {
      var o = eval("(" + this.responseText + ")");
    } catch(e) {
      var o = {};
      comet();
      return;
    }
    switch (o.state) {
    case "timeout":
      break;
    case "start":
      start();
      break;
    case "update":
      try {
        new Matrix(o.m[0], omae).paint(o.m[2], o.m[3], "rgb(255,0,0");
        new Matrix(o.m[1], omae).paint(o.m[2], o.m[3], "rgb(128,128,128");
      } catch(e) {}
      break;
    default:
      break;
    }
    comet();
  }
  xhr.open("get", "./index.cgi?c=comet&u=" + userName, false);
  xhr.send(null);
})();