2023年12月
          1 2
3 4 5 6 7 8 9
10 11 12 13 14 15 16
17 18 19 20 21 22 23
24 25 26 27 28 29 30
31            

AdSense


AdSense


SNS

  • SNS

« myloをポケコン化するwidget:mylo | トップページ | 携帯付箋紙ケース:GUM-CASE »

2008年3月11日 (火)

mylo解析用のちょっとしたツール:mylo

先日,mylo独自に行われている拡張を定義したJavaScriptファイルを直接読み出す方法が編み出された件は書いたけど,"WidgetLibrary.js","ExtensionLibrary.js","PreferencesLibrary.js"をサクッと取り出して表示を行うwidget(Get JavaScript Widget)開発&公開されました

私はまだ取り出していなかったので,非常に有難いことである.

しかし,先の方のblogにも書かれていたけど, Copy&Paset用のバッファは16KB前後かなという感じがしている.結果,取り出したデータが大きい場合は,SelectAll&Copy&Pasteで一気にテキストメモに持って行くことは出来ない.

そんなわけで,案外ニーズがあるのかも…と思い立ち,先日ちらっと触れていた,『widgetが出力した大きなテキストデータを,別マシンへ簡単に取り出す方法』に関して書いてみようと思う.

 

用意するモノはCGIが置けるhttpdサーバ.LAN内に自由に設定できるLinuxマシンが転がっていれば,作業は非常に楽でしょう.

そしてmyloで動かすwidgetは以下のようにformにし,POSTまたはGETでCGIに投げられるようにする.なお,IPアドレス/ホスト名は適時書き換えること.

<form  id="form1" name="form1" method="POST" action="http://<IPアドレス/ホスト名>/cgi-bin/post.cgi">
<textarea id="log" name="log" cols="30" rows="10">
</textarea>
(中略)
<input type="submit" value="submit">
</form>

そして『(中略)』となっている所に独自処理を行うトリガとなるボタンやセレクタ等を配置し,結果をidを"log"としたtextareaに流し込むようにする.

これでmylo側の手続きは終了.widgetを実行し,無線LANに繋いでから "submit"ボタンを押せば,textareaの内容がpost.cgiにPOSTで投げられる.POSTで送信可能なデータ容量はCopy&Paset用のバッファよりも遥かに大きいので,かなりの容量のデータも投げることが出来る.

そしてサーバ側では,以下の内容のCGIをpost.cgi という名前で置けばよい.なお,perlのpathが違う場合や,書き出しファイル名を変えたい場合は,当該箇所を書き換えること.また,実行パーミッションも立てるのも忘れないこと.

#!/usr/bin/perl

if ($ENV{'REQUEST_METHOD'} eq 'POST') {
   read(STDIN, $query, $ENV{'CONTENT_LENGTH'});
} elsif ($ENV{'REQUEST_METHOD'} eq 'GET') {
   $query = $ENV{'QUERY_STRING'};
} else {
   &return_error(500, "Invalid method.\n");
}

open(FILE, ">/tmp/log.txt") or die;
print FILE $query;
close(FILE);

print "Content-Type: text/html\n\n";
print "<!DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 4.0 TRANSITIONAL//EN\">\n";
print "<HTML>\n\n<HEAD>\n";
print " <TITLE> Result of $ENV{'REQUEST_METHOD'} </TITLE>\n";
print " <META HTTP-EQUIV=\"Content-Type\" CONTENT=\"text/html\; charset=EUC-JP\">\n";
print "</HEAD>\n\n";

print "<BODY BGCOLOR=\"#FFFFFF\">\n";
print "<PRE>\n";
   print $query;
print "</PRE>\n";
print "</BODY>\n\n";
print "</HTML>\n";
__END__

ショックを受ける程に単純な CGI だ :-)
でもそれが良い.

 

このCGIは,GET/POSTで受け取ったデータを,"/tmp/log.txt" というファイル名で書き出す機能のみを持っている.ファイルへの書き出しは,上書きになっている点は注意ね.スクリプトを書き換えるか,適時書き出されたファイルを別の場所にコピーするようにしてください.

あまりにアレなCGIなので,公開しているwebサーバには置くべきではありませんが,諸々のちょっとしたテスト/デバッグのときには,割と重宝するCGIです.

なお,クライアント側の画面では,submit後に送信したデータが表示されて終了します.そのため,mylo widgetの場合は,当該widgetを操作できなくなります.一度当該widgetを無効化し,もう一度配置しなおさないといけません.少し面倒ですね(他に良い方法があるかもですが….とりあえずhistoryをbackするボタンを張るとかしておけば良いかも).

そしてこのCGIが書き出したファイルは,エンコードされています.そのため,そのままの形では読むことが出来ません.

まずファイルの先頭に"log="というのが付いていると思うので,エディタ等でこれを削除します.その後に,以下のようなスクリプトに食わせてデコードする必要があります.

#!/usr/bin/perl
sub decode{
    my @reach = @_;
    my %form;
    foreach my $reach (@reach){
        my @pairs = split(/&/, $reach);
        foreach(@pairs){
            my ($name, $value) = split(/=/, $_);
            $value =~ tr/+/ /;
            $value =~ s/%([0-9A-Fa-f]{2})/pack("C",hex($1))/eg;
            $form{$name} = $value;
        }
    }
    return(%form);
}

while (<STDIN>) {
  print decode($_);
}

※decode関数は,以前どなたかのページに書かれていたものを,ほぼそのまま使わせていただいたもの.参考にしたのがどのページであったかは忘却の彼方…

例えば linux 上で作業しており,上記のスクリプトを dec.pl として保存した場合,

cat <CGIが吐いたテキストファイル名> | dec.pl > <出力ファイル名>

のように実行することにより,元のデータ(widgetのtextareaに置かれていたデータ)を復元することが出来ます.

ちなみに,今回は非常に単機能なCGIとしましたが,CGI内でデコードするようにしたり,漢字コードの自動認識&変換,BASE64やマルチパートの受信に対応させたりすれば,より柔軟なデバッグ用ツールとして重宝するものになるでしょう.

この辺りはお好みに合わせて作り込んでみてください.

ちなみに上記改造を施した後に"Get JavaScript Widget"を使わせていただいた結果,取り出せた各JavaScriptファイルは,ExtensionLibraris,PreferenceLibrary,WidgetLibraryそれぞれ738行,920行,274行でした.中身を読んでみて,ドキドキしっぱなしです.

« myloをポケコン化するwidget:mylo | トップページ | 携帯付箋紙ケース:GUM-CASE »

Linux」カテゴリの記事

PC」カテゴリの記事

mylo」カテゴリの記事

コメント

コメントを書く

コメントは記事投稿者が公開するまで表示されません。

(ウェブ上には掲載しません)

トラックバック


この記事へのトラックバック一覧です: mylo解析用のちょっとしたツール:mylo:

» キタコレ。 mylo™ widget programming reference [mylo com-2 blog]
mylo labosにmylo™ widget programming referenceというWigetを作るためのリファレンスが公開されたよ。明日ゆっくり読む。 やっと、APIがわかるのかな? y... [続きを読む]

« myloをポケコン化するwidget:mylo | トップページ | 携帯付箋紙ケース:GUM-CASE »