iPhone, Android などのスマートフォンでJavaScriptエラーをデバッグする

スマートフォンのJavaScriptのデバッグはなかなか大変。

■iPhone
iPhoneはわりと楽。
「設定」 -> 「Safari」 で「デベロッパ」をONにする
でも、エラーやconsole.logの詳細は教えてくれない。
今はMacと繋げれば、Mac側のsafariから色々情報が得られるようになった。便利。

■Android
残念ながら、端末にはデバッグ機能はなし
シミュレーターのlogcatってやつを使えばログも見れる
windowsなら
adb logcat | findstr browser
でブラウザ絡みのログだけに絞れる

参考
Androidシミュレーターのインストール



■サーバー側にログを残したい

上の方法だと、ちょっと物足りないのでJavaScriptでエラーがあった場合はサーバー側に通知するようにもできる
window.onerrorにJavaScriptエラーの場合の処理を書けばいい
引数にはエラーが起きた行数なんかもくるけど、IEの場合、あまり信頼できないらしい…

window.onerror = function(messsage, url, line){
  //ここに処理
}
俺の場合は、urlにエラーに関する情報をくっつけて、ajaxでページを渡して、読まれたphp側でログファイルに出力することにしたけど、より簡単そうなやり方がWeb+DB PRESS vol.63に紹介されてた

window.onerror = function(message, url, line){

  var param = "?message=" + encodeURIComponent(message)

    + "&url=" + encodeURIComponent(url)

    + "&line=" + line;

new Image().src = "error_log.gif" + param;

}
まあ、この場合もダミーのgif画像を用意しつつ、いろいろ処理はしないといけないだろうけど、読み込む方法としては楽そう