浅谈android移动开发之WebView(关于javascript与java对象之间的互调)

最新推荐文章于 2021-03-16 08:50:16 发布

lands22

最新推荐文章于 2021-03-16 08:50:16 发布

阅读量1.6k

点赞数

分类专栏： android移动开发文章标签： javascript android java 移动开发 browser object

本文链接：https://blog.csdn.net/lands22/article/details/7606664

版权

android移动开发专栏收录该内容

2 篇文章 0 订阅

订阅专栏

今天来讨论一下WebView，之前就听说google将js代码高度优化成c，然后编译执行，后面发现java里面可以调用js的函数，再到android里面居然可以让js调用java的函数，这具牛逼啊。其实原理简单来说就是将java对象赋值给js对象，就可以实现js调用java函数了。

对于webview的入门，采用一个java与javascript互调的例子：

public class CopyOfHelloWebViewActivity extends Activity {

	private WebView webView;

	private Handler handler = new Handler();

	@Override
	public void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.main);

		webView = (WebView) findViewById(R.id.webview);
		webView.setWebViewClient(new WebViewClient() {
			@Override
			public boolean shouldOverrideUrlLoading(WebView view, String url) {
				// TODO Auto-generated method stub
				view.loadUrl(url);
				return true;
			}
		});

		webView.getSettings().setJavaScriptEnabled(true);
		// webView.loadUrl("http://www.google.com.hk");
		webView.addJavascriptInterface(new Object() {
			public void clickOnAndroid() {
				handler.post(new Runnable() {
					public void run() {
						webView.loadUrl("javascript:wave()");
					}
				});
			}
		}, "demo");

		webView.loadUrl("file:///android_asset/demo.html");
	}

	@Override
	public boolean onKeyDown(int keyCode, KeyEvent event) {
		if ((keyCode == KeyEvent.KEYCODE_BACK) && webView.canGoBack()) {
			webView.goBack();
			return true;
		}
		return super.onKeyDown(keyCode, event);
	}

}

讲解一下：

1、如果访问的页面中有Javascript，则webview必须设置支持Javascript，否则页面会空白。

webView.getSettings().setJavaScriptEnabled(true);

2、如果点击页面中的链接，希望点击链接继续在当前browser中响应，而不是新打开android系统的browser中响应该链接，必须覆盖webview的WebViewClient对象，并返回true，表示自己来处理该URL链接请求。

webView.setWebViewClient(new WebViewClient() {
			@Override
			public boolean shouldOverrideUrlLoading(WebView view, String url) {
				// TODO Auto-generated method stub
				view.loadUrl(url);
				return true;
			}
		});

3、如果程序不做处理，你会发现，点击“back”按键时，整个Browser会作为一个整体返回到其他Activity中或者退出程序。现在我们需要处理”back”按钮，让它返回到初始的WebView页面上面去，这个直接对onKeyDown事件监听器进行覆盖就可以了。

@Override
	public boolean onKeyDown(int keyCode, KeyEvent event) {
		if ((keyCode == KeyEvent.KEYCODE_BACK) && webView.canGoBack()) {
			webView.goBack();
			return true;
		}
		return super.onKeyDown(keyCode, event);
	}

4、我们需要将一个java对象绑定到一个javascript对象中,这就需要调用webView的addJavascriptInterface(Object obj,String interfaceName)方法，javascript对象名就是interfaceName，作用域是Global。这样初始化webview后，在webview加载的页面中就可以直接通过demo访问到绑定的java对象了。

webView.addJavascriptInterface(new Object() {
			public void clickOnAndroid() {
				handler.post(new Runnable() {
					public void run() {
						webView.loadUrl("javascript:wave()");
					}
				});
			}
		}, "demo");

最后来看看在html中是怎样调用的：

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
	function wave() {
		alert("1");
		document.getElementById("droid").src = "android_waving.png";
	}
</script>
</head>
<body>
	<a onClick="window.demo.clickOnAndroid()">
			<img id="droid" src="android_normal.png" /><br> Click me!
	</a>
</body>
</html>

如果程序是在Android2.3系列系统运行的话，发现在js调用不了java对象的方法，而且程序会报错，自动强行退出。关于这个bug有详细的描述：

http://code.google.com/p/android/issues/detail?id=12987

具体的错误为：JNI WARNING: jarray 0x4074f6e0 points to non-array object (Ljava/lang/String;)

这个是指android在进行JNI调用时，把一个Java中的String对象当数组来访问了，最终导致虚拟机崩溃。如果有兴趣研究的童鞋，可以参考：

http://blog.csdn.net/a345017062/article/details/6394864