当前位置： 移动技术网 > 移动技术>移动开发>Android > html和java的交互，利用jsBridge开源框架

html和java的交互，利用jsBridge开源框架

2018年02月11日  | 移动技术网移动技术  | 我要评论

html中，js注册监听和回调

        function connectWebViewJavascriptBridge(callback) {
            if (window.WebViewJavascriptBridge) {
                callback(WebViewJavascriptBridge)
            } else {
                document.addEventListener(
                    'WebViewJavascriptBridgeReady'
                    , function() {
                        callback(WebViewJavascriptBridge)
                    },
                    false
                );
            }
        }

        connectWebViewJavascriptBridge(function(bridge) {
            bridge.init(function(message, responseCallback) {
                　　　　　　　　alert('init方法js收到的消息：'+message);
                　　　　　　　　if(message.indexOf("url=")>=0){
               　　　　　　　　     var url = message.substring(4,message.length);
              　　　　　　　　      alert("收到url:"+url);                   
            　　　　　　 　　   }
            　　　　　　  　　  if (responseCallback) {
             　　　　　　  　　     responseCallback('js返回的消息');//js的返回，java收取
　　　　　　　　　　　　　　　　　　} 
　　　　　　　　　　　　　　　　}
　　　　　　　　　　　);
　　　　
　　　　bridge.registerHandler("functionInJs", function(data, responseCallback) {//"submitFromWeb"为html和java协商的协议字符串，可以通过registerHandler设置多个不同的协商串和回调
　　　　   alert('registerHandler方法js收到的消息：'+data);
　　　　    if('java调用js'==data){
　　　　        showAlert("js自己的方法");
　　　　    }
 　　　　   if (responseCallback) {
 　　　　       responseCallback('js返回的消息');//js的返回，java收取
 　　　　   }
　　　　});
 

java中，注册监听和回调

 webView.setDefaultHandler(new DefaultHandler() {
            @Override
            public void handler(String data, CallBackFunction function) {
                Log.d(TAG, "setDefaultHandler方法java收到的消息：" + data);
                if ("openFile".equals(data)) {
                    pickFile();
                    return;
                }
                if (function != null) {
                    function.onCallBack("java返回的消息");//java的返回，js收取
} } }); webView.setWebChromeClient(mOpenFileWebChromeClient);//html动画需要注册的操作对象供webview使用
　　　　webView.registerHandler("submitFromWeb", new BridgeHandler() {//"submitFromWeb"为html和java协商的协议字符串，可以通过registerHandler设置多个不同的协商串和回调
  　　　　  @Override
  　　　　  public void handler(String data, CallBackFunction function) {
 　　　　　　       Log.i(TAG, "registerHandler方法java收到的消息：" + data);
  　　　　      function.onCallBack("java返回的消息");//java的返回，js收取
 　　　　   }

　　　　});
 

java给js发消息，不接收js响应

webView.send("java给js发送的消息");

 

java给js发消息，接受js响应

if (button.equals(v)) {
            webView.callHandler("functionInJs", "java调用js", new CallBackFunction() {

                @Override
                public void onCallBack(String data) {
                    // TODO Auto-generated method stub
                    Log.i(TAG, "js返回的消息： " + data);
                }

            });

js给java发消息，不接收java响应

  function testClick() {
            var data = "js发出的消息";
            window.WebViewJavascriptBridge.send(data);
        }

js给java发消息，接受java响应

function testClick33(){
            var data = "js发出的消息";
            window.WebViewJavascriptBridge.send(data , function(responseData) {
                    alert('java返回的消息：'+responseData)
                });
        }

function testClick1() {
      window.WebViewJavascriptBridge.callHandler(
           'submitFromWeb'
             , 'js调用java方法'
             , function(responseData) {
               alert('java返回的消息：'+responseData)
             }
       );
}

js中打开文件的书写

 <input type="file"  value="选择文件" />

java中，需要设置

webView.setWebChromeClient(mOpenFileWebChromeClient);
OpenFileWebChromeClient类
public class OpenFileWebChromeClient extends WebChromeClient {
        public static final int REQUEST_FILE_PICKER = 1;
        public ValueCallback<Uri> mFilePathCallback;
        public ValueCallback<Uri[]> mFilePathCallbacks;
        Activity mContext;
        public OpenFileWebChromeClient(Activity mContext){
            super();
            this.mContext = mContext;
        }
        // Android < 3.0 调用这个方法
        public void openFileChooser(ValueCallback<Uri> filePathCallback) {
            mFilePathCallback = filePathCallback;
            Intent intent = new Intent(Intent.ACTION_GET_CONTENT);
            intent.addCategory(Intent.CATEGORY_OPENABLE);
            intent.setType("*/*");
            mContext.startActivityForResult(Intent.createChooser(intent, "File Chooser"),
                    REQUEST_FILE_PICKER);
        }
        // 3.0 + 调用这个方法
        public void openFileChooser(ValueCallback filePathCallback,
                                    String acceptType) {
            mFilePathCallback = filePathCallback;
            Intent intent = new Intent(Intent.ACTION_GET_CONTENT);
            intent.addCategory(Intent.CATEGORY_OPENABLE);
            intent.setType("*/*");
            mContext.startActivityForResult(Intent.createChooser(intent, "File Chooser"),
                    REQUEST_FILE_PICKER);
        }
        //  / js上传文件的<input type="file" name="fileField" id="fileField" />事件捕获
        // Android > 4.1.1 调用这个方法
        public void openFileChooser(ValueCallback<Uri> filePathCallback,
                                    String acceptType, String capture) {
            mFilePathCallback = filePathCallback;
            Intent intent = new Intent(Intent.ACTION_GET_CONTENT);
            intent.addCategory(Intent.CATEGORY_OPENABLE);
            intent.setType("*/*");
            mContext.startActivityForResult(Intent.createChooser(intent, "File Chooser"),
                    REQUEST_FILE_PICKER);
        }

        @Override
        public boolean onShowFileChooser(WebView webView,
                                         ValueCallback<Uri[]> filePathCallback,
                                         WebChromeClient.FileChooserParams fileChooserParams) {
            mFilePathCallbacks = filePathCallback;
            Intent intent = new Intent(Intent.ACTION_GET_CONTENT);
            intent.addCategory(Intent.CATEGORY_OPENABLE);
            intent.setType("*/*");
            mContext.startActivityForResult(Intent.createChooser(intent, "File Chooser"),
                    REQUEST_FILE_PICKER);
            return true;
        }
    }

java中，当前activity的onActivityResult方法

 protected void onActivityResult(int requestCode, int resultCode, Intent intent) {
        if (requestCode == OpenFileWebChromeClient.REQUEST_FILE_PICKER) {
            if (mOpenFileWebChromeClient.mFilePathCallback != null) {
                Uri result = intent == null || resultCode != Activity.RESULT_OK ? null
                        : intent.getData();
                if (result != null) {
                    String path = MediaUtility.getPath(getApplicationContext(),
                            result);
                    Uri uri = Uri.fromFile(new File(path));
                    mOpenFileWebChromeClient.mFilePathCallback
                            .onReceiveValue(uri);
                } else {
                    mOpenFileWebChromeClient.mFilePathCallback
                            .onReceiveValue(null);
                }
            }
            if (mOpenFileWebChromeClient.mFilePathCallbacks != null) {
                Uri result = intent == null || resultCode != Activity.RESULT_OK ? null
                        : intent.getData();
                if (result != null) {
                    String path = MediaUtility.getPath(getApplicationContext(),
                            result);
                    Uri uri = Uri.fromFile(new File(path));
                    mOpenFileWebChromeClient.mFilePathCallbacks
                            .onReceiveValue(new Uri[] { uri });
                } else {
                    mOpenFileWebChromeClient.mFilePathCallbacks
                            .onReceiveValue(null);
                }
            }

            mOpenFileWebChromeClient.mFilePathCallback = null;
            mOpenFileWebChromeClient.mFilePathCallbacks = null;
        }
    }

后续使用中如果有问题，再次补充

您可能感兴趣的文章:

如对本文有疑问， 点击进行留言回复！！

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网