今日はajax通信でエラーが吐き出された時の中身を確認する方法を紹介いたします。
ajaxなどのhttp通信では、エラー時にxhr, textStatus, errorThrownをひと固まりで吐き出します。その中身を見るためにはconsole.logで
一項目ずつ引数を指定してあげる必要があります。
コードで書き表すと下記のようになります。
console.log("xhr : " + JSON.stringify(xhr)); console.log("textStatus : " + textStatus); console.log("errorThrown : " + errorThrown.message);
上記のxhrは従来のconsole.logに入れると[Object object]で表示されなくなるので、JSON.stringify関数で囲んでください。
この中身を見ることで、クライアント・サーバー間でどのタイミングでエラーになったかを確認することができます。
例としてログで吐かれたxhrの中身を見てみます。
[INFO:CONSOLE(1)] "xhr : {"readyState":0,"status":0,"statusText":"error"}", source: file:///android_asset/www/static/js/main.7a2980e1.js (1)
引数にstatusという項目で0と返ってきていますが、この0とはタイムアウト(接続時間が長すぎて途中で切られた結果の値。サーバー側ではなくブラウザから送られてくるもの)を指します。
このほかにも、404(ファイルが存在しない)や401(許可されていない)など、原因によってさまざまな値を返してくれるので
そこから解決方法を紐付けることが出来れば素早くデバッグ処理をすることができると思います。
ajaxで通信したけどエラーが帰ってきたでも何がエラーか分からない!という方は試してみてください、それでは。