- Home Startseite ホーム 主页 首頁
- SDK
- Dev Guide Handbuch Guía Guide Guida 開発ガイド 开发人员指南 開發指南
- Reference Referenz Referencia Référence Riferimento リファレンス 参考 參考資料
- Resources
- Videos ビデオ
- Blog ブログ 博客 網誌

Android.com

# Debugging Web Apps

## Quickview

- You can debug your web app using console methods in JavaScript
- If debugging in a custom WebView, you need to implement a callback method to handle debug messages

## In this document

1. Using Console APIs in the Android Browser
2. Using Console APIs in WebView

## See also

1. Debugging

If you're developing a web application for Android, you can debug your JavaScript using the `console` JavaScript APIs, which output messages to logcat. If you're familiar with debugging web pages with Firebug or Web Inspector, then you're probably familiar with using `console` (such as `console.log()`). Android's WebKit framework supports most of the same APIs, so you can receive logs from your web page when debugging in Android's Browser or in your own `WebView`.

## Using Console APIs in the Android Browser

## Logcat

Logcat is a tool that dumps a log of system messages. The messages include a stack trace when the device throws an error, as well as log messages written from your application and those written using JavaScript `console` APIs.

To run logcat and view messages, execute `adb logcat` from your Android SDK `tools/` directory, or, from DDMS, select Device > Run logcat. When using the ADT plugin for Eclipse, you can also view logcat messages by opening the Logcat view, available from Window > Show View > Other > Android > Logcat.

See Debugging for more information about .

When you call a `console` function (in the DOM's `window.console` object), the output appears in logcat. For example, if your web page executes the following JavaScript:

    console.log("Hello World");

Then the logcat message looks something like this:

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

The format of the message might appear different depending on which version of Android you're using. On Android 2.1 and higher, console messages from the Android Browser are tagged with the name "browser". On Android 1.6 and lower, Android Browser messages are tagged with the name "WebCore".

Android's WebKit does not implement all of the console APIs available in other desktop browsers. You can, however, use the basic text logging functions:

- `console.log(String)`
- `console.info(String)`
- `console.warn(String)`
- `console.error(String)`

Other console functions don't raise errors, but might not behave the same as what you expect from other web browsers.

## Using Console APIs in WebView

If you've implemented a custom `WebView` in your application, all the same console APIs are supported when debugging your web page in WebView. On Android 1.6 and lower, console messages are automatically sent to logcat with the "WebCore" logging tag. If you're targeting Android 2.1 (API Level 7) or higher, then you must provide a `WebChromeClient` that implements the `onConsoleMessage()` callback method, in order for console messages to appear in logcat.

Additionally, the `onConsoleMessage(String, int, String)` method introduced in API Level 7 has been deprecated in favor of `onConsoleMessage(ConsoleMessage)` in API Level 8.

Whether you're developing for Android 2.1 (API Level 7) or Android 2.2 (API Level 8 or greater), you must implement `WebChromeClient` and override the appropriate `onConsoleMessage()` callback method. Then, apply the `WebChromeClient` to your `WebView` with `setWebChromeClient()`.

Using API Level 7, this is how your code for `onConsoleMessage(String, int, String)` might look:

    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);
      }
    });

With API Level 8 or greater, your code for `onConsoleMessage(ConsoleMessage)` might look like this:

    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;
      }
    });

The `ConsoleMessage` also includes a `MessageLevel` to indicate the type of console message being delivered. You can query the message level with `messageLevel()` to determine the severity of the message, then use the appropriate `Log` method or take other appropriate actions.

Whether you're using `onConsoleMessage(String, int, String)` or `onConsoleMessage(ConsoleMessage)`, when you execute a console method in your web page, Android calls the appropriate `onConsoleMessage()` method so you can report the error. For example, with the example code above, a logcat message is printed that looks like this:

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

↑ Go to top