AJAXリモート・ログ・エージェント技法
 Ajaxでデバッグしよう



フィッシュボーン
大坪　保行
2007/3/6

　サーバ側サービス・プログラム

　 リモート・ログ・エージェント・プログラムから送られてきた3つのメッセージをログとして記録するJSPまたはCGIプログラムです。URIでアクセスできればどのような言語にて実装しても問題ありません。

　私の仕事の現場ではJavaを開発言語として使用することが多いので、JSPやServletとして実装していますが、今回はレンタルサーバでも利用しやすいようにPerlで作成しました。以下のソースを参考にしてください。

local %params;

# エージェントはGETメソッドだけを使用するのでPOSTは考慮しない
# リモートログエージェントから送られてたログ情報を環境変数から取得する。
@params = split('&', $ENV{'QUERY_STRING'});

# ログ情報はURLエンコードされているのでデコード（エンコード前の情報に）する。
foreach $param (@params) {
    # メッセージ内に'='が使用されている場合があるので、最初の'='を':='に変換する
    $param =~ s/=/:=/;

    # ':='にてパラメータ名と値を分離する
    ($name, $val) = split(':=', $param);
    $name =~ tr/+/ /;
    $val  =~ tr/+/ /;
    $name =~ s/%([A-Fa-f0-9][A-Fa-f0-9])/pack("C", hex($1))/eg;
    $val  =~ s/%([A-Fa-f0-9][A-Fa-f0-9])/pack("C", hex($1))/eg;

    $params{$name} = $val;
}

# 複数ユーザにて同時使用するため、利用ユーザを区別するために
# 利用者のアドレスを取得する。
$remote_addr = $ENV{'REMOTE_ADDR'};
ソース4：Remote Log サービス　− 引数処理部

# 複数ユーザにて同時使用するため、利用ユーザを区別するために
# 利用者のアドレスを取得する。
$remote_addr = $ENV{'REMOTE_ADDR'};

#
# ログ記録日付時間をシステムから取得する。
($sec, $min, $hour, $mday, $mon, $year, $wday, $yday, 
$isdst) = localtime(time);（本来は1行）

# ログファイル名を作成する。日付毎にファイルが別になるようする。
$logfilename = sprintf "logfile%4.4d%2.2d%2.2d.log",
($year+1900),($mon+1),$mday;（本来は1行）

# ログ記録日時からタイムスタンプ文字列を作る。
$logtime = sprintf "%4.4d/%2.2d/%2.2d %2.2d:%2.2d:%2.2d", 
($year+1900),($mon+1),$mday,$hour,$min,$sec;（本来は1行）

# ファイルが存在しない場合は新規に作成する。
# ファイルがある場合は、追記モードにてオープンする。
open logfile, ">>${logfilename}" or die "Can not open
 logfile\n";（本来は1行）

# 取得した情報を元にログをファイルに記録する。
print logfile "${logtime} C ${remote_addr} ";
print logfile "${params{'module'}} ${params{'func'}} 
\"${params{'message'}}\"\n";（本来は1行）

　
ソース5：Remote Log サービス　− ログ記録処理部

　ここでのポイントは、リモート・ログ・エージェントから送られてきた3つの文字列以外に、記録した日付や時刻と送信元アドレスとして環境変数REMOTE_ADDRの値を一緒に記録しています。

　特に送信元アドレスの記録は、複数ユーザーが同時に使用することが多いWebシステムでは、複数ユーザーのログが同一ファイルに混在してしまったときに、grepなどのテキスト抽出ツールで送信元アドレス値を手掛かりに自分のログを抽出するために使用します。

# 複数ユーザーにて同時使用するため、利用ユーザーを区別するために
# 利用者のアドレスを取得する。
$remote_addr = $ENV{'REMOTE_ADDR'};


# 取得した情報を元にログをファイルに記録する。
print logfile "${logtime} C ${remote_addr} ";
　
ソース6：サーバ側サービス・プログラムのポイント

2007/01/26 22:07:13 C 192.168.1.10 sample.html startlog() "Start Log"
2007/01/26 22:07:13 C 192.168.1.10 sample.html startlog() "ii=0"
2007/01/26 22:07:13 C 192.168.1.10 sample.html startlog() "ii=1"
2007/01/26 22:07:13 C 192.168.1.10 sample.html startlog() "ii=2"
2007/01/26 22:07:13 C 192.168.1.10 sample.html startlog() "ii=3"
2007/01/26 22:07:13 C 192.168.1.10 sample.html startlog() "ii=4"
2007/01/26 22:07:13 C 192.168.1.10 sample.html startlog() "ii=5"
2007/01/26 22:07:13 C 192.168.1.10 sample.html startlog() "ii=6"
2007/01/26 22:07:13 C 192.168.1.10 sample.html startlog() "ii=7"
2007/01/26 22:07:13 C 192.168.1.10 sample.html startlog() "ii=8"
2007/01/26 22:07:13 C 192.168.1.10 sample.html startlog() "ii=9"
2007/01/26 22:07:13 C 192.168.1.10 sample.html startlog() "End Log"
2007/01/26 22:07:13 C 192.168.1.10 日本語 使えます "便利です"
ソース7：ログとして記録された内容

　sample.htmlのstartlog()関数内にてfor文によるループを回しています。このループ内ではremotelog()関数の呼び出しを行っています。ログ例を見ていただくと分かりますが、同一時刻に高速にループ内の処理が実行されていることが記録されています。また、日本語のメッセージも正しく送られていることが記録されています。

　導入方法

　実際に開発の現場で利用する場合は、それぞれのプロジェクトで開発したHTMLやJavaScriptなどのファイルに組み込んで使用することになります。

1）設定ポイント

Perlにて実装しましたので WebサーバにApacheを使うサイトでPerlが利用できる環境であればほとんど修正せずに利用が可能だと思います。ここでは、CGIの格納フォルダとして/cgi-binを使用していますが、異なるフォルダを利用されている方は、利用環境に合わせて次の個所を修正して利用してください。

 // 下記のJSP名を環境に応じて修正してください
 var remoteJsp = "/cgi-bin/remotelog.pl"
設定ポイント

　変数名の末尾がJspになっているのは、普段使用しているシステムではJSP版を使用しているためです。特に意味があって付けたわけではありません。

2）導入方法

　デバッグしたいHTMLまたはJSPファイルに、リモート・ログ・エージェント機能を読み込む設定を1行追加します。

　今回のサンプルHTMLでは、<HTML>タグのすぐ後に、リモート・ログ・エージェント機能を利用するためのファイルを読み込む記述をしています。デバッグ対象プログラムから利用するので、それより先に読み込まれる必要があることを注意してください。

　利用方法

　使用するメソッドは、以下のようにログをサーバへ出力する1つだけです。

　remotelog()関数には3つの引数がありますが、デバッグ時に便利な情報として、ファイル名、モジュール名、メッセージ文の3つの文字列を引数として渡しています。ここでは引数として渡す文字列を使い分けていますが、処理としては3つの文字列をサーバへ送信しているだけですので、それぞれ適当な文字列を渡してください。

　さっそくAjaxなデバック環境を試してみよう

　今回紹介しましたリモート・ログ・エージェント技法は、機能もシンプルで画面操作も要らないので仕様に与える影響もありません。デバッグ環境の改善や動作検証記録取得を目的とした技法です。従ってプログラマーがAjaxを現場へ導入して試すには最適だと思います。

　Ajaxといっても、ソースコードを見ると意外と簡単なことが分かると思います。ここからXMLやDOM操作などに発展すれば、これまでのWebアプリケーション構築とは違った世界が見えてくるでしょう。

　最後に、サンプルを含むソースコード一式はこちらからダウンロードしてください。これを応用してプロジェクトの開発環境の改善に役立ててください。

3/3  

　INDEX
Ajaxでデバッグしよう
  Page1
厳しい開発の現場│充実する開発環境│ログが残せない│貧弱なクライアント開発環境│Ajax使っていますか？│AjaxはGUIじゃない
  Page2
開発環境の改善│基盤技術│動作概要│構成ファイル│動作確認用サンプルHTML│リモート・ログ・エージェント・プログラム
Page3
サーバ側サービス・プログラム│導入方法│利用方法│さっそくAjaxなデバック環境を試してみよう




HTML5 + UX フォーラム 新着記事
＠ITメールマガジン　新着情報やスタッフのコラムがメールで届きます（無料）

注目のテーマ

HTML5＋UX 記事ランキング

本日 月間
＠IT