ちょっとプログラマーぽいことでも書こうかな。

業務ではPHPフレームワークとして、CakePHP使用してるのですが、htmlコードが吐き出された後の動的な部分は所詮PHPとなんら変わらないので、ユーザーの動作に応じたり、アニメーション的な動きを見せるにはやっぱJavaScriptじゃないと難しいところもあったりするわけです。

で、CakeとJQueryで何かをしようとするとちょっと一工夫必要になるので、色々大変・・・

本日、とある箇所でハマって4時間程悩み続けてましたorz

それは、Ajaxで非同期通信をしている際に起こりました。

Cakeには便利なデバッグモードというconfigureが存在しており、このオプション数値を変えることで、デバッグ時だけ出したい情報や、SQLログ保存など様々なことが出来るわけです。

が、しかし!

便利に見えるこの機能、仕様をよく知らないで使うとえらい目に合います・・


・Cakeのコントローラー内処理抜粋


function hoge(){
    // debugMode ON
    Configure::write('debug',1);

  $data_list = $this->testFunc();
    return $data_list;
}



JQuery側でこのhogeを呼んで、非同期通信をすると通常ならば$data_listを受け取れます。
その後、JavaScript側で扱えるように色々操作する必要があるのですが、その際に問題が起きました。

FireBugで動作確認していると、データは受け取れているが配列処理?でエラーが出ている・・・だと・・・?!

httpRequest通信は250OKと表示されており、データも受け取れている。
しかし、dataのevalでなんちゃらエラーとなっている。


どういうことェ・・・


結論から書くと、


dataの末尾に<!-- 1.200s -->のような
htmlコメントコードが入っていた!!


此れは何かというと、Cakeは自身が行った処理をdebugモードレベルに応じて、出力しているらしい。

つまり、Cakeのデバッグは開発途中なので1にしていたら、ちゃっかりやつが末尾にくっついてきたために、渡したデータを綺麗な形で配列し直し出来なかったというわけ。

・・・気づくのが遅くなってえらい目にあいました(´Д⊂ヽ

Cake側の渡す直前のデータをデバッグメールやログに書きだしても問題ないうえ、JQuery側で受け取った後にalert()やconsole.log()などで表示するもデータは正常に受け取れているように見えるため、原因がわからず、受け取った直後の配列し直しの直前でbreak入れることでやっとわかりました。

なんだか、これくらい知ってて当たり前ぽいうえに、マニュアル読んでないのが丸分かりで恥ずかしいw

しっかり読んでおこうと思った、いやほんとに。

そんなわけで、自分以外に今後同じようにCake使い始めてJavaScript使って何かやりたいなーと思ってる人がハマったときの参考にでもなればと思うので残しておきます。