[WebView学习之五]:调试Web Apps

       上一篇我们学习了( [WebView学习之四]:迁移到Android4.4版本的WebView),今天我们来继续学习。

       (博客地址:http://blog.csdn.net/developer_jiangqq),转载请注明。

       Author:hmjiangqq

       Email:[email protected]  

    如果你正在Android4.4或者更高的版本上面测试你的Web应用程序(Application)，你可以使用Chrome开发工具进行远程调试你的Web页面，该方法同时也支持Android低版本。更多信息请查看:RemoteDebugging on Android.

          如果你没有Android4.4或者更高版本的设备，那么你可以使用控制台JavascriptAPIs在logCat中打印日志消息来调试Javascript。如果你熟悉使用Firebug或者Web Inspector，那么你也可能熟悉使用控制台(console,例如:console.log())。AndroidWebkit框架同样支持很多相同工恩呢刚的APIs。当我们调试Android浏览器或者我们自己的WebView的时候，我们可以从Web页面获取日志消息。本文主要讲解如何使用控制台APIs来进行调试。

(一)在Android浏览器中使用控制台APIs(Using Console APIs in theAndroid Browser)

        当你调用console方法(使用DOM对象 window.console)会在logcat中打印日志。例如：在网页中你可以执行一下Javascript代码:

        console.log("HelloWorld");

         然后在logCat中会打印出来一下的日志信息:

        Console: HelloWorld http://www.example.com/hello.html :82

        具体的打印出来的消息的格式会跟着Android系统的版本走。在Android2.1以上来自Android浏览器的控制台信息会带有"browswer"。在Android1.6以下，Android浏览器信息会带有"WebCore"。

        AndroidWebKit框架没有实现其他桌面浏览器所有的控制台信息APIs功能,但是你可以使用基本的一些日志方法:

<span style="font-size:18px;">	1.console.log(String)
	2.console.info(String)
	3.console.warn(String)
        4.console.error(String)</span>

     还有一些其他的控制台方法，可能和其他Web浏览器表现的效果不太一样。

(二)在WebView中使用控制台APIs(Using Console APIs in WebView)

         上面我们介绍的控制台APIs在WebView中也通知支持调试。如果你的运行的设备在Android2.1以上版本，那么你必须要提供WebChromeClient类并且实现onConsoleMessage()方法来打印日志到控制台.然后你使用setWebChromeClient()方法把绑定WebChromeClient到你有的WebView中。

         例如:为了Android API 7版本,实现onConsoleMessage(String,int,String)方法:

<span style="font-size:18px;">		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);
		  }
		});
</span>

当然如果你的API的版本最低是8或者更高时，你可以实现onConsoleMessae(ConcoleMessage)方法,例如:

	<span style="font-size:18px;">	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;
		  }
		});
</span>

   ConsoleManager也提供了MessageLevel对象表示控制台上面的信息的类型,你可以用messageLevel()方法来确定日志消息的紧急严重性，并且采取相应的措施。

     不论你使用onConsoleMessage(String,int,String)还是onConsoleMessage(ConsoleManager)，当你在Web页面上面执行控制台方法的时候，Android会在适当的地方调用onConsoldeMessage()方法以便你可以发生错误。例如上面的代码，打印的日志如下:

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