Symfoware

Symfowareについての考察blog

Cordova デバッグ Androidエミュレーター実行時のconsole.logの見方

Cordovaでアプリケーションを作成。
Androidエミュレーターで動作を確認している時デバッグしたい。

こんな時のためのconsoleプラグインだろうと思い、
ログの見方を調べてみます。

org.apache.cordova.console



サンプルアプリケーション



ボタンを押したらログを出力する簡単なサンプルを作成しました。


  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.     <meta charset="utf-8" />
  5.     <meta name="format-detection" content="telephone=no" />
  6.     <meta name="msapplication-tap-highlight" content="no" />
  7.     <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />
  8. </head>
  9. <body>
  10. <div>
  11.     <h1>console.logサンプル</h1>
  12.     <div>
  13.         <button id="log">console.log書き込み</button>
  14.     </div>
  15. </div>
  16. <script type="text/javascript" src="cordova.js"></script>
  17. <script type="text/javascript" src="lib/jquery-2.1.3.min.js"></script>
  18. <script type="text/javascript">
  19. $(function() {
  20.     
  21.     $('#log').on('click', function() {
  22.         console.log('logを出力');
  23.     });
  24. });
  25. </script>
  26. </body>
  27. </html>






adb logcat



こちらが参考になりました。
phonegapの実機テストでconsole.logの出力結果を見る

このコマンドで表示できます。


$ adb logcat CordovaLog:V *:S




エミュレーターで実行した画面上のボタンをポチポチ押すと、
こんなログが出力されます。


$ adb logcat CordovaLog:V *:S
--------- beginning of /dev/log/system
--------- beginning of /dev/log/main
I/CordovaLog( 1808): Changing log level to DEBUG(3)
D/CordovaLog( 1808): file:///android_asset/www/index.html: Line 7 : Viewport target-densitydpi is not supported.
I/CordovaLog( 1901): Changing log level to DEBUG(3)
D/CordovaLog( 1901): file:///android_asset/www/index.html: Line 7 : Viewport target-densitydpi is not supported.
D/CordovaLog( 1901): file:///android_asset/www/index.html: Line 24 : logを出力
D/CordovaLog( 1901): file:///android_asset/www/index.html: Line 24 : logを出力
D/CordovaLog( 1901): file:///android_asset/www/index.html: Line 24 : logを出力
D/CordovaLog( 1901): file:///android_asset/www/index.html: Line 24 : logを出力







Dalvik Debug Monitor



もうひとつの方法は、こちらを参考にしました。
Setting up console debugging for PhoneGap and Android

android sdkのインストールフォルダのtoolsにあるddmsが使えそうです。

571_01.png


ここにはパスを通しているはずなので


$ ddms



で起動できます。

571_02.png


起動しているデバイスを選択すると、ログがドバっと出力されます。
Saved Filltersの「+」をクリック。フィルターを追加します。

571_03.png


「CordovaLog」という名前で絞り込み。

571_04.png


console.logで出力した内容が表示されました。

571_05.png
関連記事

テーマ:プログラミング - ジャンル:コンピュータ

  1. 2015/02/28(土) 17:13:05|
  2. 備忘録
  3. | トラックバック:0
  4. | コメント:0
  5. | 編集
次のページ