Android官方文档之Web Apps调试

概览

• 你可以使用控制台的Javascript方法调试你的web app
• 如果是在定制的WebView中调试，你需要实现一个回调方法来处理调试信息

文档内容

在Android Browser中使用控制台API

在WebView中使用控制台API

参考

调试

如果你是在为Android开发web应用，那么，你可以使用控制台（console）的Javascript API（the console  JavaScript APIs）来调试你的Javascript代码并将信息输出到logcat。如果你对使用Firebug 或 Web Inspector调试web页面比较熟悉，那么，你对使用console（比如console.log（））也应该比较熟悉了。Android的 Webkit框架支持大多数同样的API，因此在Android的浏览器中或者WebView 中调试的时候，你可以接收来自于web页面的logs。

在Android Browser中使用控制台API

Logcat

Logcat是一个工具，用来转储（dump）系统信息日志。这些信息包括设备抛出错误时的堆栈路径，以及你的应用写下的日志信息和使用JavaScript console  API写下的日志信息。

要运行logcat并查看信息，从你的Android SDK  tools/ 目录执行adb logcat  ，或者从DDMS选择 Device > Run logcat 。当使用 ADT plugin for Eclipse 时，你同样可以通过打开Logcat view来查看logcat信息，打开途径是 Window > Show View > Other > Android > Logcat .。

在 Debugging 你可以获取更多关于 <codelogcat< code="">.</codelogcat<>的信息。

当你调用一个console 函数（在DOM的window.console 对象中），输出会出现在logcat中。例如：如果你的web页面执行了下面的Javascript：

console.log("Hello World");

那么logcat 信息看起来就是类似于下面的样子：

Console: Hello World http://www.example.com/hello.html :82

在 各个信息的格式根据Android版本的不同可能看起来会有不同。在Android 2.1及更高，来自于Android Browser的console信息会标记为"browser"。在Android 1.6及更低版本，AndroidBrowser信息则是标记为"WebCore"。

Android的WebKit并没有实现在桌面版浏览器中所实现的所有console API。但是，你可以使用下面的基本的文本日志函数（text logging function）：

• console.log(String)
• console.info(String)
• console.warn(String)
• console.error(String)

其他一些console函数不产生错误，但是它的行为与你在其他web浏览器中预期的行为可能不一样。

在WebView中使用控制台API

如果你在应用中实现了一个定制的WebView ， 那么，当你在WebView中调试你的web页面的时候，所有相同的console API也是被支持的。在Android 1.6及更低版本，console信息是自动发送给logcat的，并加上了"WebCore"日志标签。如果你是为Android 2.1（API Level 7）及更高版本开发，那么就必须提供一个实现了onConsoleMessage()  回调方法的WebChromeClient ，以便让console信息显示在logcat中。

另外，在API Level 7中引入的onConsoleMessage(String, int, String) 方法已经弃用了，而在API Level 8中使用的是onConsoleMessage(ConsoleMessage) 。

无论你是在为Android 2.1(API Level 7) 或 Android 2.2 (API Level 8 或更高)开发，你都需要实现WebChromeClient  并覆盖onConsoleMessage()  回调方法。然后，使用setWebChromeClient() 将WebChromeClient 应用到你的WebView  中。

如果是使用 API Level 7,那么是使用 onConsoleMessage(String, int, String) 的代码看起来可能是下面这个样子：

WebView myWebView = (WebView) findViewById(R.id.webview);
myWebView.setWebChromeClient(new WebChromeClient() {
  public void onConsoleMessage(String message, int lineNumber, String sourceID) {
    Log.d("MyApplication", message + " -- From line "
                         + lineNumber + " of "
                         + sourceID);
  }
});

如果是使用API Level 8或更高版本， 那么你使用 onConsoleMessage(ConsoleMessage) 代码看起来可能是下面的样子：

WebView myWebView = (WebView) findViewById(R.id.webview);
myWebView.setWebChromeClient(new WebChromeClient() {
  public boolean onConsoleMessage(ConsoleMessage cm) {
    Log.d("MyApplication", cm.message()



 + " -- From line "
                         + cm.lineNumber()



 + " of "
                         + cm.sourceId()



 );
    return true;
  }
});

ConsoleMessage  还包括 MessageLevel 来指示出发送的console 信息的类型。你可以通过 messageLevel() 来查询信息层次（message level），以便确定信息重要性，然后再使用合适的Log 方法或采用其他合适的行动。

无论你是使用 onConsoleMessage(String, int, String)  还是 onConsoleMessage(ConsoleMessage) ，当你在web页面中执行一个console方法时，Android会调用合适的 onConsoleMessage() 方法，以便你能报告错误。例如，采用上面的示例代码，一个logcat信息打印出来可能是下面这个样子的：

Hello World -- From line 82 of http://www.example.com/hello.html

 

原文链接：Debugging Web Apps

 

译文来源：http://www.webapptrend.com/

 WebAppTrend是一个独立的技术博客，关注Web App前瞻和实践，以及智能浏览器发展 

请大家在关注ITeye的同时，关注我们的新浪微博 @WebAppTrend，关注我们的腾讯微博@WebAppTrend，Q Q群见官方博客右侧。