かつおの「もっと教えてくれや!」
#9_デバッグ機能でエラー解決や!
どうも。かつおです。
GWは皆さんいかが過ごされたでしょうか?
私は、讃岐うどんを求めて香川でうどん学校に入学し、自分でうどんを作って、一気に4玉食べてきました。
讃岐うどんのようにコシのあるエンジニアを目指して進化していきますよぉ~。
ってなわけで今回も始まります。
![かつお](/framework/column/images23/tmb/katsuo.webp)
うーん、これがこうなるから、あれがああなって……
よっしゃようやく上手く動いたぞ、これでどうにか納期に間に合うわ
![かつお](/framework/column/images23/tmb/katsuo.webp)
はっ……夢か
あーこれどうしたらええねん。みんな帰ってもうたし、こりゃ困ったぞ
![???](/framework/column/images23/tmb/colleague.webp)
忘れ物はなんですかー見つけにくいものですか~
![かつお](/framework/column/images23/tmb/katsuo.webp)
なんや音痴な幻聴まで聞こえてきたで
![中島](/framework/column/images23/tmb/nakajima.webp)
あ、ふぐ本さんじゃないですか。どうしたんですかこんな時間に
![かつお](/framework/column/images23/tmb/katsuo.webp)
なんや、中島くんやったんか
ちょっと納期が近い開発が終わってなくてな。中島くんこそどうしたんや、帰ったんちがったんか
![中島](/framework/column/images23/tmb/nakajima.webp)
それがちょっと忘れ物しちゃいまして
開発大変ですね、それじゃあ帰りますね。おつかれさまです~
![かつお](/framework/column/images23/tmb/katsuo.webp)
おいおい、中島くん待ってくれや
そこは「何か手伝いましょうか」ぐらいの気を利かせてくれや
![中島](/framework/column/images23/tmb/nakajima.webp)
えー、またこのパターンですか。今日は通販で安眠枕が届くから早く帰ろうと思ったのに。何を困ってるんですか?
![かつお](/framework/column/images23/tmb/katsuo.webp)
今作ってるプログラムが何でか上手く動かんのや
ほんますまんが、ちょっと見てくれんか
![中島](/framework/column/images23/tmb/nakajima.webp)
うぅ、仕方ないですね……分かりました、見ましょう
![かつお](/framework/column/images23/tmb/katsuo.webp)
いつもすまんのー
おれの中で中島くん株爆上げ中やで。じゃあ早速このプログラム見てくれや
![中島](/framework/column/images23/tmb/nakajima.webp)
うわー、パターンプラグインからJavaScriptまで、かなり 独自実装 してカスタマイズしていますね
![かつお](/framework/column/images23/tmb/katsuo.webp)
どや、すごいやろ、渾身の作やぞ。持てる全ての力を注ぎ込んでやったわ
![中島](/framework/column/images23/tmb/nakajima.webp)
たしかにすごいですけど、これはやりすぎですよ
標準パターンを活用しよう
という話はどこに……
![かつお](/framework/column/images23/tmb/katsuo.webp)
できるだけ標準パターンの動作に沿うのが理想なのは分かっとるが、今回ばかりは要件的に難しかったんや
あとちょっと凝りすぎてしもた
で、やりすぎてしまったからか思うように動かんようになってしまったんや、
困ったで
![中島](/framework/column/images23/tmb/nakajima.webp)
これはもう一つずつ状況を確認していくしかなさそうですね
![かつお](/framework/column/images23/tmb/katsuo.webp)
そうなんやが、どこ見たらいいかもよく分からんようになってきたんや
![中島](/framework/column/images23/tmb/nakajima.webp)
そうですかぁ
では確認箇所を言うので一緒に見ていきましょうか
![かつお](/framework/column/images23/tmb/katsuo.webp)
おおー、そりゃ助かるわ
![中島](/framework/column/images23/tmb/nakajima.webp)
まずはよく使う楽々Framework3の デバッグモード で見ていきましょう
デバッグモードで実行するには、RakStudioからデバッグ実行で実行する方法と、URLパラメータで指定する方法があります
![デバッグモードで実行する2つの方法](/framework/column/images23/debugging-functions/ka9-1.webp)
![かつお](/framework/column/images23/tmb/katsuo.webp)
『RakStudioを使おう! ~ロジックを使いこなせ!~』で軽く言っとったデバッグモードな。あれからよく使っとるで
![中島](/framework/column/images23/tmb/nakajima.webp)
それです。ロジックの情報の他にも実行しているプログラムの 詳細な情報 が表示されるので開発時に活用するととっても便利ですよ
![かつお](/framework/column/images23/tmb/katsuo.webp)
他にはどんなのがあるんや
ちなみに、ロジックの設定だけでなく、たまにロジックが出しているデバッグメッセージも、確認できることには気づいとるぞ
![中島](/framework/column/images23/tmb/nakajima.webp)
上部だけなく、下部にもこんなにも役立つ情報がたくさん出力されていますよ
特によく見る部分に注釈をいれておきました
![プログラムの詳細な情報](/framework/column/images23/debugging-functions/ka9-2.webp)
![かつお](/framework/column/images23/tmb/katsuo.webp)
おお! それぞれこんな意味があったんかい
![中島](/framework/column/images23/tmb/nakajima.webp)
例えばそれぞれ次の状況の時に確認をするといいと思います
これが楽々Frameworkの
スゴイ
ところなんです
状況 | 確認 |
---|---|
エラーが発生している | エラーログ |
設定したロジックが意図通り動いていない | ロジックの実行情報 |
パターンプラグインのメソッドが呼ばれない | 呼び出されたパターンプラグインメソッド |
意図したデータが取得できていない | 発行したSQL |
前画面から値が渡ってきているか怪しい | 前画面から渡ってきたパラメータ |
オプションが効いているか分からない | オプションの設定値 |
![かつお](/framework/column/images23/tmb/katsuo.webp)
こんなとこから簡単に確認できたんか
そういうのは、もっと早く教えてくれや
![中島](/framework/column/images23/tmb/nakajima.webp)
(この人、講習を聞いてなかったのかなあ…)
ちなみにデバッグモードには更にこんな効果もあります
通常の実行モードだと、キャッシュを有効活用して通信量を減らすために、
JavaScriptやCSSは別ファイルとして出力
されるんですが、デバッグモードだとJavaScriptやCSSが展開され、
埋め込まれた
状態で出力されます!
![通常モードとデバッグモードでのファイル出力方法の違い](/framework/column/images23/debugging-functions/ka9-3.webp)
![かつお](/framework/column/images23/tmb/katsuo.webp)
な、なんだってー!?
って、これなんかええことあるんか
![中島](/framework/column/images23/tmb/nakajima.webp)
すべての情報が 一つのHTMLファイル にまとめられます。これによって、HTMLソースでの確認がとっても楽になります!
![かつお](/framework/column/images23/tmb/katsuo.webp)
な、なんやってー!? ってもうええか
なんか分かったぞ、一つにまとまっとったらブラウザ側の処理のJavaScriptが動かない時とか、
CSSが効かない時に原因を確認するの楽やもんな
![中島](/framework/column/images23/tmb/nakajima.webp)
その通りです
HTML上にちゃんとHiddenででているかとか、JavaScriptでどんな処理が設定されているのかとかもファイルをあちこち行き来せずに確認できますね
ブラウザのデバッガで確認する時も、1ファイルにまとまってた方が見るのが楽です
![ファイルの行き来なしで動作確認可能その1](/framework/column/images23/debugging-functions/ka9-4a.webp)
![ファイルの行き来なしで動作確認可能の図2](/framework/column/images23/debugging-functions/ka9-4b.webp)
![かつお](/framework/column/images23/tmb/katsuo.webp)
これや、これをやりたかったんや
パターンプラグインとかのJavaで実装している部分に関しては、Eclipseのデバッガでブレークポイントを張って確認できてたけど、ブラウザの部分が困っとったんや
仕方ないから、勘……じゃないわ根性で試しとったわ
![中島](/framework/column/images23/tmb/nakajima.webp)
まずは状況を正確に把握するのが、一番ですからこれは役立ちますね
他にも、楽々Framework3のデバッグで役立つ機能として
トレースログ出力機能
があります
SeiConfigパラメータで出力したいトレースログを指定できます
例えば、発行したSQLのログや、アクセスのログなどを出力できるようになります
詳細は以下のJavadocを確認してください
楽々Framework3 Javadoc jp.co.sei.is.lib21.pms インタフェース dSeiConfig ログ
![かつお](/framework/column/images23/tmb/katsuo.webp)
なんや、知らんかっただけでデバッグのための機能がえらい用意されとったんやな。早速解決に向けて調べるでー
まずはこの何でかプログラム起動したらするエラーになるやつや
これは……おっ
エラーログ
出とるやないか、どれどれ……ってこれ俺が実装したパターンプラグインの部分が原因やんけ。まぁ想定の範囲内やな
![中島](/framework/column/images23/tmb/nakajima.webp)
ええ……じゃあちゃんと確認しましょうよ
![かつお](/framework/column/images23/tmb/katsuo.webp)
すまんすまん
次は難問やぞ。ロジックの実行情報のところに何や出とるけどよう分らんのや。特にエラーログもないしの
![ロジックの実行情報](/framework/column/images23/debugging-functions/ka9-5.webp)
![中島](/framework/column/images23/tmb/nakajima.webp)
*debug(0): [Logic] all of key value is null.って
*debug(0):
[Logic][前画面からキー項目が渡されたかチェック][before-view][COMPONENT1_1]
のロジックのところで出てますけど、キー項目の値が渡ってきていないじゃないですか?
![かつお](/framework/column/images23/tmb/katsuo.webp)
んなわけあるかい。キー項目は従業員番号(emp_no)でちゃんと渡ってきてるはずやぞ
ほら、これ見てみい
![Servlet Parameters](/framework/column/images23/debugging-functions/ka9-6.webp)
![中島](/framework/column/images23/tmb/nakajima.webp)
emp_noは渡ってきていないですね。前画面からはどうやって遷移しているんですか?
![かつお](/framework/column/images23/tmb/katsuo.webp)
うわ、ほんまや。なんでや、なんなんや
ちゃんとJavaScriptでリンク作って遷移するように、気合で独自に実装したはずやぞ!?
![中島](/framework/column/images23/tmb/nakajima.webp)
前画面のHTMLソースから、リンク作成部分をデバッグしてみてみましょう
![かつお](/framework/column/images23/tmb/katsuo.webp)
デバッグモードONで画面開いて、そのHTML見るんやな。emp_noのHiddenはちゃんとでとるわ
ブラウザのデバッガで確認すると……あっ、リンク生成の処理、URLパラメータつけ忘れとるわ。あちゃーこれかいな
![中島](/framework/column/images23/tmb/nakajima.webp)
それっぽいですね。早速直して動作見てみてください
![かつお](/framework/column/images23/tmb/katsuo.webp)
直った、直ったぞ。ちゃんと元気に動くようになったやないか
![中島](/framework/column/images23/tmb/nakajima.webp)
よかったです。この調子で一個ずつ潰していきましょう
![かつお](/framework/column/images23/tmb/katsuo.webp)
……よっしゃ、これで帰れる目途がたったぞ。これも中島くんのおかげやの
![中島](/framework/column/images23/tmb/nakajima.webp)
これはもしや!?
![かつお](/framework/column/images23/tmb/katsuo.webp)
おう! 飲みに行くぞ。夢の中へご招待や
![中島](/framework/column/images23/tmb/nakajima.webp)
うふっふー
っということで、どんどん楽々Frameworkでの開発スキルを上げていくふぐ本さん。
果たしてこのまま順調に進んでいくことができるのか!?
次回「かつお、これどうなっとんねん!」をお送りします。
※タイトル及び内容は予告なく変更される場合があります。あらかじめご了承ください。