wonderflでtraceを使う方法

wonderfl http://wonderfl.net/ でtraceを使う方法を調べました。

traceって何だ？

いわゆる「printfデバッグ」だな。
変数の中身を知りたいとき、

trace('i=',i, ' array=', ary[i]); 

みたいな感じで、変数の中身をデバッグ出力コンソールに表示させるんだ。
FlashCS4とかを使えばちゃんとそのウィンドウが出てくるんだけど、wonderflの場合は表示できない。
それを表示できるようにしよう、というのがテーマ。

環境

• WindowsXP
• Firefox3.5
• FlashPlayer10

方法

1. Firefoxをインストール。
2. Firefoxを起動。
3. すでにFlashPlayerが入っていればアンインストール。
   http://www.adobe.com/support/flashplayer/downloads.html#uninstaller
4. Debug版FlashPlayerをダウンロード。
   http://www.adobe.com/support/flashplayer/downloads.html
   
   そのファイルを実行して、インストール。
5. Firefoxのアドオン FlashTrackerをインストール。
   mozilla.orgで配布されているもの https://addons.mozilla.org/ja/firefox/addon/3469 は古いのでインストールしない。
   http://www.sephiroth.it/firefox/flashtracer/
   に行って、[install xpi]をクリックしてインストール。
6. Firefox再起動。

C:\Documents and Settings\若桜　IT というフォルダ（「若桜　IT」の部分はユーザ名によって変わる）の下に mm.cfg　をテキストエディタで作成。
中身を以下のようにする。

ErrorReportingEnable=1
TraceOutputFileEnable=1
MaxWarnings=0

http://wonderfl.net/code/4aca4e874cb431ee169314b79c87328af6726519
のswfを実行して、traceを出力してみる。

これでDebug版FlashPlayerから flashlog.txt が出力された。
C:\Documents and Settings\若桜　IT\Application Data\Macromedia\Flash Player\Logs に flashlog.txt　がある。

Firefox再起動。

Firefoxで[Tools→FlashTracker]を選び、サイドバーにtraceログを表示させる。

（ここでtraceログを正常に表示できていたら、この後を読む必要は ありません）

[f:id:itouhiro:20100124142303g:image]

using: C:\Documents and Settings\若桜　IT\mm.cfg
flashlog.txt file does't exists. Open settings dialog first.

このメッセージは、
「C:\Documents and Settings\若桜　IT\mm.cfgのほうは読み込めているが、
flashlog.txt が見つかりません」といっている。

なんとflashlog.txtがあるにもかかわらず、FlashTrackerから読みだせない。
PATHに日本語文字を含んでいるのが悪いのだろう。
mm.cfgファイルの中に flashlog.txt への場所が自動的に記述されるのだが、このファイルの文字コードをShift_JISからUTF-8に変更してもダメだ。

とはいっても、デバッグ版Flash Playerのflashlog.txt出力位置は変更できない。
ならば、日本語文字を含まないPATHから flashlog.txt にアクセスできるようにすればよい。

ジャンクションを作成する。
http://homepage1.nifty.com/emk/symlink.html の「リンク/ジャンクション作成ツール」1.05をダウンロード。
ジャンクションは、UNIXのシンボリックリンクと違って、「フォルダ」に対してしか、はれない。

ln.exeを取り出して、c:\homeに置く。
次に以下の命令文を入力する。

c:
cd \home
C:\home>ln -j "C:\Documents and Settings\若桜　IT\Application Data\Macromedia\Flash Player\Logs" Logs

ちなみに「"C:\Documents and Settings\若桜　IT\Application Data\Macromedia\Flash Player\Logs"」の部分は、コマンドプロンプトへ直接入力しなくても、そのフォルダをコマンドプロンプトにドラッグドロップすればOK。

FlashTrackerのサイドバーの下にある[Setting]で、flashlog.txtの場所と文字コードを設定する。

場所を C:\home\Logs\flashlog.txt
文字コードは UTF-8 を指定すればいい。

http://wonderfl.net/code/4aca4e874cb431ee169314b79c87328af6726519
をリロードして、swfを実行する。

traceログが表示されるようになった。

これで、wonderflで開発中に、変数の中身を手軽に調べることができるわけだね。デバッグが楽になるね。

ブラウザで無料ではじめるActionScript 3.0 ―It's a wonderfl world―