Android WebViewJavaScriptBridge

2018-02-01  本文已影响0人  Ghost小新

将jsbridge引入我们的工程

Eclispe

导入jar包, 或者直接copyjar源码, jar可以到gitHub上下载。

Android Studio

repositories {
    // ...
    maven { url "https://jitpack.io" }
}

dependencies {
    compile 'com.github.lzyzsd:jsbridge:1.0.4'
}

JS调用原生并传递数据

注:有两种注册方法
android代码
1:

 mWebView.registerHandler("test", new BridgeHandler() {
            @Override
            public void handler(String data, CallBackFunction function) {
           function.onCallBack("指定Handler收到Web发来的数据,回传数据给你");
}

2:

 mWebView.setDefaultHandler(new BridgeHandler() {
            @Override
            public void handler(String data, CallBackFunction function) {
                function.onCallBack("指定Handler收到Web发来的数据,回传数据给你");
            }
        });

js代码
1:

function test() {
           //调用本地java方法
           //第一个参数是 调用java的函数名字 第二个参数是要传递的数据 第三个参数js在被回调后具体执行方法,responseData为java层回传数据
           var data='发送消息给java代码指定接收';
           window.WebViewJavascriptBridge.callHandler(
               'test'
               ,data
               , function(responseData) {
                   bridgeLog('来自Java的回传数据: ' + responseData);
               }
           );
       }

2:

function test() {
           //发送消息给java代码
           var data = '发送消息给java代码全局接收';

           window.WebViewJavascriptBridge.send(
               data
               , function(responseData) {
                  bridgeLog('来自Java的回传数据: ' +responseData);
               }
           );
       }

原生调用JS

js代码

 //注册事件监听
       function test(callback) {
           if (window.WebViewJavascriptBridge) {
               callback(WebViewJavascriptBridge)
           } else {
               document.addEventListener(
                   'WebViewJavascriptBridgeReady'
                   , function() {
                       callback(WebViewJavascriptBridge)
                   },
                   false
               );
           }
       }

在使用WebViewJavaScriptBridge的时候需要首先判断一下WebViewJavaScriptBridge是否存在,如果不存在需要通过添加监听'WebViewJavascriptBridgeReady'来监听

//注册回调函数,第一次连接时调用 初始化函数
       connectWebViewJavascriptBridge(function(bridge) {
           bridge.init(function(message, responseCallback) {
               bridgeLog('默认接收收到来自Java数据: ' + message);
               var responseData = '默认接收收到来自Java的数据,回传数据给你';
               responseCallback(responseData);
           });

           bridge.registerHandler("test", function(data, responseCallback) {
               bridgeLog('指定接收收到来自Java数据: ' + data);
               var responseData = '指定接收收到来自Java的数据,回传数据给你';
               responseCallback(responseData);
           });
       })

android代码
发送数据默认接收

mWebView.send("发送数据给web默认接收",new CallBackFunction(){
                    @Override
                    public void onCallBack(String data) {
                        Log.e(TAG, "来自web的回传数据:" + data);
                    }
                });

注:回调函数CallBackFunction()可为空

发送数据给指定方法

mWebView.callHandler("test","发送数据给web指定接收",new CallBackFunction(){
                    @Override
                    public void onCallBack(String data) {
                        Log.e(TAG, "来自web的回传数据:" + data);
                    }
                });
上一篇下一篇

猜你喜欢

热点阅读