なんとなく、こんな感じ

なんとなくはじめた、Ajaxでのチャットの作成。
なんとなく、なんとなくな、状況までたどりついた。


お試しするならこちら。
一応、IEとFireFoxで動作を確認してあります。
追記10/01/2005 サーバ移転に伴いリンク先が動かなくなりました。現在の最新版はこちらで試せます。
コードのダウンロードはこちら。
今まで書くのをすっかり忘れてたけど、サーバー側はPerlで書いてますし、JcodeとXML::DOMを使ってます。適宜気合でインストールしてください。

使い方

匿名希望と書かれているエディットボックスに、HN名を入力。そのままEnterを押すか、「入室」ボタンを押す。
運がよければ右側の入室者一覧に既に入室している人の名前が表示される。
下の長いエディットボックスに発言したい内容を入力して、Enterを押すか、「送信」ボタンを押す。その際、下のラジオボタンで指定した色で発言することができる。
誰かが入室してくれば、だれそれさんが入室しました。退室すれば、だれそれさんが退室しました。と表示される。
ネットワークが切れて30秒くらい過ぎると自動的に退室となる。
ということで、なんとなくそれっぽいところまではたどりついた。
まぁまだいくつか不具合はあるが、こんなところでしょう。

自分が気がついている不具合。

たまに、入室者一覧表示に、大量に自分が表示される。
XMLのノードの順番を決め打ちしているので、たまたま動いているだけかもしれない。このへんって微妙。。。。
サーバー側のCPUが結構回るようになっちゃった。何人もつなげられないんだろうな。
ネットワークが切れたときのタイムアウトをクライアントのIPアドレスでやってるから、2窓などをやると、怪しい。。。
セキュリティのこととか、あんまりよくわかってないので、一応<>関係はつぶしたつもりだけど、まだいくつか抜けてるかもしれない。

ここまで書いて学んだこと

Perl

$aは変数。@aは配列変数。@_の要素は$_[0], $_[1]…でアクセスできる。
sub 関数名 で関数が作れる。
my $valとやるとローカル変数ができる。myをつけないとグローバル変数。
関数の引数はすべて参照渡し。@_で取れる。
my ( $val1, $val2) = @_;ってやっとくとコピーをとるのでわかりやすい。
複数のファイルにプログラムを分ける場合は、
呼ばれる側:
package 名前空間名; を頭につける
1; をお尻につける
呼ぶ側:
require ‘ファイル名’;を頭につける
名前空間名::関数名 で呼び出せる。
PerlでXMLDOMを使った限りではクラスなども作れるみたい。
Knave Web講座Perl講座がPerlの勉強には便利。
XMLinuxXML::DOMの使い方でPerlでXMLDOMを叩く大体を学習。あとは、XML::DOMのヘルプ。まぁXMLDOMなんてもんは大体メソッドなどは同じだから。。。最初に取り付いちゃえばどうにかなる。

JavaScript

var valとやると、ローカル変数。
PerlでXMLDOM触って、JavaScriptでXMLDOM触るもんだから、頭の中がちゃんぽんになる。メンバの名前が微妙に違う。
commentNode.childNodes[ 0].firstChild.nodeValue;

$xmlCommentNode->getChildNodes->item( 0)->getFirstChild->getNodeValue;
などね。
まぁIEとFireFoxでも微妙に違ったけど。。。
attributes[ 0].value;(IEとFireFoxで動作)
attributes[ ‘color’].value; (FireFoxだけ動作)
文字の色を変えるのに、spanをcreateElementしてるんだが、こいつのcolorアトリビュートを変更するのに、createAttributeしてうんぬんかんぬんと調べてたが、結局よくわからなかった。途中で、style.colorをいじればOKと気がついて、無駄に。。。
普段、C++とかC#で、それも、VisualStudioという統合環境に慣れてるから、秀丸+Printデバッグにちょっと苦労。んでも、やりゃぁできるな。
なんとなぁく、JavaScriptもPerlもクラスの概念というかデザインパターンというか、そのへんの感覚が使いづらいというか、まぁ慣れてないんだろうな。どちらも型が無いようなもんなので、型チェックをコンパイラにどうのこうのというのが使えなくて、どうもねぇ。
それでも、なんでも、実際に、Ajaxを体験してみて、いろいろとアイデアやら、問題点やらが体感できておもしろかったです。

コメントを残す

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください