Android端 h5和原生交互的方式

一、h5传递给原生WebView的数据协议

传递的是个json字符串：

{
    "id": "random_value",
    "action": "action_name",
    "callback": "function_name",  // optional
    "data": {...}  // optional
}

id：这次操作的id，回调时会再传回来。因为交互有可能是异步的，对同一个接口调用多次时，回调时以id来区分是哪一次。id由js自己定义保证唯一即可，简单的做法是使用Math.random()
action：操作名称，取名应该能反映其意义，例如getIp（获取ip地址）
callback：可选，操作完成后的js回调函数名。不用回调就不传此参数
data：可选，某些操作才需要。app会解析data中的数据使用。

例如：h5调用原生的网络请求可以这么定义

{
     "id":100,
     "action":"doRequest",
     "callback","onResponse"
     "data":{
         "method":"get",
         "url":"",
         "body":""
         "header":""
         "type":"noCache"
     }
}

二、原生WebView传递给h5的数据协议

原生WebView传给h5的也是个json字符串:

{
    "id": "random_value"
    "action": "action_name",
    "platform": "android"
    "data": {...}  
}

id：与传给WebView的一致。
action：与传给WebView的一致。如果各种操作都用同一个回调函数，则可以此区分是哪个操作。
platform：平台
data：操作结果对应的数据，是原生提供给h5的具体数据

三、h5通过js的调用方式

注入的对象在android是全局变量，也即是window的成员变量，android这边会提供一个统一的调用方法入口，叫postMessage，注入的对象名叫nativeCaller，调用方式如下：

function callNative(object) {
  if (window.nativeCaller) {
    window.nativeCaller.postMessage(JSON.stringify(object))
  } else {
    alert("此功能需要在原生WebView中使用！")
  }
}

四、Android端的处理方式

创建BaseJsHandler的子类，例如获取原生设备信息的处理

public class DeviceInfoHandler extends BaseJsHandler {

    @Override
    public String action() {
        return "getDeviceInfo"; //对应h5请求数据中action
    }
    //data是h5请求数据的data节点,callback是h5的回调函数方法名
    @Override
    protected JSONObject handleMessage(JSONObject data, String callback) {
        //这里返回的json数据最终会被包装到data节点内,该过程是框架完成的,无需关心.
        JSONObject toJson = new JSONObject();
        try {
            toJson.put("isWifi", NetworkUtils.isWifiAvailable());
            toJson.put("isNetworkAvailable", NetworkUtils.isNetworkAvailable());
            if (null != AppUtils.getPackageInfo()) {
                toJson.put("packageName", AppUtils.getPackageInfo().packageName);
                toJson.put("versionCode", AppUtils.getPackageInfo().versionCode);
                toJson.put("versionName", AppUtils.getPackageInfo().versionName);
                toJson.put("screenWidth", PixUtils.screenWidth());
                toJson.put("screenHeight", PixUtils.screenHeight());
                toJson.put("statusBarHeight", PixUtils.statusBarHeight());
                toJson.put("deviceId", AppUtils.getDevId());
            }
        } catch (JSONException e) {
            e.printStackTrace();
        }
        return toJson;
    }

}

然后调用WebViewInject类的addHandler方法注入该处理类

WebViewInject.getInstance().addHandler("getDeviceInfo", DeviceInfoHandler.class);