jsBridge整理

1.接入 

a.在最外层build.gradle添加 allprojects {repositories {jcenter()maven{url "https://jitpack.io"}}} 

b.在主工程build.gradle添加 dependencies{compile 'com.github.lzyzsd:jsbridge:1.0.4' }

 2.使用

 A.在布局文件中使用BridgeWebView替代WebView 

B.js调用java 

场景一：自定义函数调用，调用指定的函数，js端与java端的方法名需保持一致

 1）java端注册handler，实现js调用的回调 

 BridgeWebView mBridgeWebView = (BridgeWebView)context.findViewById(R.id.xxx); mBridgeWebView.registerHandler( 

 //第一个参数与js端定义的方法名保持一致

 "myJsThodName", 

 //第二个参数BridgeHandler,接收js传来的数据并将处理结果回调给js端 

 new BridgeHandler(){@overridepublic void handler(String data ,CallbackFunction function){Log.e(TAG,"js端传来的数据是："+data);

function.onCallBack("回调内容");} } );

 2）js端定义调用java的函数

调用java

function javaClick(){

var data="给java端数据";

window.WebViewJavascriptBridge.callHandler('myJsThodName',

data,function (responseData){birdgeLog('来自java端回传的数据'+responseData);});  }      

场景二：默认函数调用，无需额外定义方法名  

1）java端设置默认handler  mBridgeWebView.setDefaultHandler(new BridgeHandler(){@overridepublic void handler(String data,CallbackFunction function){Log.e(TAG,"js端传来的数据是："+data);function.onCallBack("回调内容);}}  );      2)js端定义调用java的函数

调用java用default方式

function javaClick(){var data = "给java端的数据"window.WebViewJavascriptBridge.send(data,function (responseData){birdgeLog('来自java端回传的数据'+responseData);});  }    

C. java调用js 

****js端代码****

1)注册事件监听function connectWebViewJavascriptBridge(callback){

//判断WebViewJavascriptBridge是否存在，不存在需要通过webViewJavascriptBridgeReady来添加监听

if(window.WebViewJavascriptBridge){callback(WebViewJavascriptBridge);}

else{document.addEventListeter('WebViewJavascriptBridgeReady',

function(){callback(WebViewJavascriptBridge);},false);}}

2)注册回调函数，初始化函数connectWebViewJavascriptBridge(function(bridge){

//场景一：默认函数调用

bridge.init(function(data,responseCallback){bridgeLog('java端发来的数据'+data);

var responseData = '回传给java端的数据';

responseCallback(responseData);});

//场景二：自定义函数调用bridge.registerHandler(

//与java端方法名保持一致

'myJavaThodName',function(data,responseCallback){bridgeLog('java端发来的数据'+data);

var responseData = '回传给java端的数据';responseCallback(responseData);});})

js共通函数，log打印函数

显示web打印日志

function bridgeLog(logContent) {          document.getElementById("log_msg").innerHTML = logContent;      }

******java端代码*****

场景一：默认函数调用mBridgeWebView.send("给js端发送的数据",new CallbackFunction(){@overridepublic void onCallBack(String data){Log.e(TAG,"js端回传的数据"+data);}});

场景二：自定义函数调用mBridgeWebView.callHandler(){"myJavaThodName","给js端发送的数据",new CallbackFunction(){@overridepublic void onCallBack(String data){Log.e(TAG,"js端回传的数据"+data);}}}