Ajaxのデバッグを簡単に実行したい!!


ブログの更新を頑張っています。ぽんてです。

最近Ajaxの非同期通信を利用したシステム開発をしているのですが、
とにかくデバッグがしにくい!

僕は普段、PHPを使うときは「var_dump()」を利用して配列やオブジェクトの中身を確認しながら、
コーディングをしています。
ところがどっこい、Ajaxを利用した非同期通信では、PHP側で「var_dump()」をしても画面に何も出力されない!
ということで、自分なりに見つけたデバッグ方法を紹介したいと思います。

まずは前提です。

前提

1.使用ブラウザはChrome
2.実際にブラウザに描画されているソースの中に、下記のようにAjaxの記述してあるとする。


※画面のどこかに、 のような記述がすでにある前提です。

では次はデバッグのための準備です。

準備



1.Ajax非同期通信の飛び先である、/demo/ajaxTest/ファイルに下記のように記述


これで準備OKです。
では早速デバッグを行うために、前提のとこで用意した、「」をクリックしてみましょう。

確認

1.Chromeをデベロッパーツールを立ち上げます。(Ctr+Shift+I)
2.Consoleタグをクリック

はい、ここで$_POSTの中身が確認できたと思います。
どうでしょうか。


JQuery

Posted by ぽんて