【cordova-react】ajax通信でerror判定の時のデバッグ方法

今日は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で通信したけどエラーが帰ってきたでも何がエラーか分からない!という方は試してみてください、それでは。

 

参考にさせていただいたサイトです。->http://taka.hatenadiary.com/entry/2013/11/10/HTTP%E3%82%B9%E3%83%86%E3%83%BC%E3%82%BF%E3%82%B9%E3%82%B3%E3%83%BC%E3%83%89%E3%82%92%E4%BD%BF%E3%81%A3%E3%81%A6AJAX%E9%80%9A%E4%BF%A1%E3%82%92%E6%95%B4%E7%90%86%E3%81%99%E3%82%8B

 

>株式会社シーポイントラボ

株式会社シーポイントラボ

TEL:053-543-9889
営業時間:9:00~18:00(月〜金)
住所:〒432-8003
   静岡県浜松市中央区和地山3-1-7
   浜松イノベーションキューブ 315
※ご来社の際はインターホンで「316」をお呼びください

CTR IMG