在H5开发中,有时候需要调用安卓原生的功能,比如调用摄像头、调用相册、获取地理位置等等,这时候就需要用到H5与原生安卓的交互。本文将详细介绍h5开发的app如何调用原生安卓的方法。
**一、原理**
在WebView中加载一个网页,等于在安卓应用程序中内嵌一个浏览器,可以在页面中加载html、css、js等前端技术所编写的内容。此时,H5与原生安卓调用原生功能的方法基于安卓提供的js调用原生方法的接口,通过js与安卓原生相互传递参数与调用,进而实现页面中native与web页面的互相调用、互相传参。
**二、详细介绍**
1.在安卓的MainActivity中指定WebView的加载页面
```
webView.loadUrl("http://www.baidu.com/");
```
2.在H5调用安卓方法前需要先将要调用的方法绑定给WebView
```
//定义一个类,继承自 WebViewClient
public class MyWebViewClient extends WebViewClient {
//设置 WebViewClient 并打开 JS 支持
@Override
public void onPageFinished(WebView view, String url) {
super.onPageFinished(view, url);
webView.loadUrl("javascript:window.android_obj.getSource("
+ "document.body.innerHTML);");//定义JS接口
}
}
//注册方法并为其命名(可自定义)
webView.addJavascriptInterface(this, "android_obj");
webView.setWebViewClient(new MyWebViewClient());
//开启 Javascript 支持
webView.getSettings().setJavaScriptEnabled(true);
```
3.在H5页面中调用安卓原生方法
```
//通过 window.android_obj 引用已经绑定的 getPic 方法
window.android_obj.getPic();
```
4.在安卓中编写具体的JS接口实现类
```
//绑定 JS 接口
webView.addJavascriptInterface(new AndroidJSInterface(), "android_obj");
// JS 接口实现类
public class AndroidJSInterface {
//获取当前的网页源码
@JavascriptInterface
public void getSource(String html) {
Log.e("html", html);
}
//打开相机
@JavascriptInterface
public void openCamera(){
Intent intent = new Intent(MediaStore.ACTION_IMAGE_CAPTURE);
startActivityForResult(intent, 0);
}
}
```
**三、注意事项**
1.在H5调用安卓原生方法时,需要默认在主线程中执行。
2.使用addJavascriptInterface绑定JS接口实现类时,需要为该类所在的包添加注解 @JavascriptInterface。
3.在Android 4.2(API 17)之后,默认不允许在js中调用原生方法,需要在WebView中开启此功能。开启方式为:在WebView中用getSettings()获取WebSettings对象,并通过setJavaScriptEnabled(true)的方式设置开启JS功能。
4.为保证安全性,在H5页面调用原生方法时,需要认真审核并确认方法所传递的参数的充分性、正确性,避免注入等不安全行为的发生。
**四、总结**
综上所述,通过WebView可以实现H5与原生安卓的交互,使得应用程序在满足前端UI美观性的同时,同时调用安卓原生功能,进而增强应用的可用性。同时,在实现过程中,我们还需要认真审核所传递的参数的充分性、正确性,使得应用程序更加安全可靠。