jsbridge实现及原理_jsBridge原理解析

导语

现在大多数App与H5的交互越来越多，jsBridge是一个能使webView和js交互的通信方式，本文只对https://github.com/lzyzsd/JsBridge(以下涉及到的jsBridge源码都是出自这个框架)进行分析，只要你懂得了其中的原理，你也可以封装一个jsBridge。不过在介绍jsBridge的原理前，我会简单介绍下原始的webView与js交互以及为什么要用jsBridge。

一、WebView与js交互

原始的js交互非常简单容易理解，直接给出一段客户端的代码。

//开启支持js交互

mWebView.getSettings().setJavaScriptEnabled(true);

//添加js回调接口，第一个参数是我们本地写的一个专门提供方法给H5的js对象；第二个参数是双方规定好的命名，只有注册的名称和H5那边对应才可交互。

mWebView.addJavascriptInterface(new JSRequest(), "jsRequest");

class JSRequest{

@JavascriptInterface //只有加了这个注解的方法才能被h5调用

public void actionFromH5(){

Log.v("JSRequest","H5调用了该方法");

}

}

// 本地调用H5的方法用loadUrl实现，actionFromNative是在H5里实现的一个方法

mWebView.loadUrl("javascript:actionFromNative()");

二、WebView的js对象注入漏洞

webView的js对象注入的方式非常简单，可是为什么建议使用jsBridge呢？因为该方式存在安全隐患。上述提到本地方法加了@JavascriptInterface注解才能被h5调用，这个是在Android4.2之后加的，是为了避免恶意js代码获取本地信息，如SD卡中的用户信息。但是@JavascriptInterface无法兼容4.2以前的版本，所以4.2之前的系统都有被随时侵入获取信息的可能。

那么js是如何做到的？答案是反射。4.2之前没有加@JavascriptInterface的情况下，js是可以通过你注入的js对象(addJavascriptInterface的第一个参数)直接拿到getClass(这个方法是基类Object的方法)，然后再拿到Runtime对象用来执行一些命令。原理大概就是这样，如果想具体了解如何实现的，请阅读WebView的Js对象注入漏洞解决方案。

三、jsBridge源码分析

jsBridge的最大作用就是解决了WebView的安全隐患，任何版本的系统都是适用的。还是一样，下面先介绍下jsBridge的用法，一些配置我就不介绍了，直接拿主干部分。

//一些初始化代码就不展示了

······································

// 第一个参数在本地注册一个叫"submitFromWeb"的方法供H5调用，

// 第二个参数是实现了BridgeHandler接口的匿名类用来回调。

webView.registerHandler("submitFromWeb", new BridgeHandler() {

@Override

public void handler(String data, CallBackFunction function) {

// 这里的data是H5传给本地的数据，function.onCallBack是回调给H5的字符串数据

L