Android原生app與H5交互

1.開發背景。

隨着當前開發迭代要求速度更快，改動更靈活，不需要發佈版本就能實時更新app的內容，故當前H5製作界面越來越受到科技公司和開發者的歡迎。

2.實現交互

今天記錄一下開發過程中用到的H5交互方法，採用了第三方框架jsbridge，記錄一下，以防自己忘記了。廢話少說，直接上代碼。

1）首先到app的配置文件build.gradle中設置依賴

implementation 'com.github.lzyzsd:jsbridge:1.0.4'

2）activity的核心代碼

 webview.setDefaultHandler(new DefaultHandler());
        webview.setWebChromeClient(new WebChromeClient() {
            @Override
            public void onProgressChanged(WebView view, int newProgress) {
                super.onProgressChanged(view, newProgress);
                if (newProgress == 100) {//取消進度加載框
                    mHnLoadingLayout.setStatus(HnLoadingLayout.Success);
                }
            }

            @Override
            public void onReceivedTitle(WebView view, String title) {
                super.onReceivedTitle(view, title);
                if (StringUtils.isNotEmpty(title, true)) {
                    if (title.length() >= 10) {//處理H5界面標題字符串過長導致展示不出的問題
                        String strTitle = title.substring(0, 10) + "...";
                        mTvTitle.setText(strTitle);
                    } else {
                        mTvTitle.setText(title);
                    }
                }

            }
        });

       

        String token = HnPrefUtils.getString(NetConstant.User.TOKEN, "");
        if (About.equals(getIntent().getStringExtra("type"))) {
            webview.loadUrl(getIntent().getStringExtra("url") + "&&access_token=" + token);
        }

      //註冊監聽方法當js中調用callHandler方法時會調用此方法（handlerName必須和js中相同）
        webview.registerHandler("send", new BridgeHandler() {
            @Override
            public void handler(String data, CallBackFunction function) {
                //顯示js傳遞給Android的消息
                sendinfo(data);
                //Log.e("Android收到了消息",data);
                //Android返回給JS的消息
                function.onCallBack("我是js調用Android返回數據：");

            }
        });

        webview.setDefaultHandler(new DefaultHandler() {
            @Override
            public void handler(String data, CallBackFunction function) {

                function.onCallBack("Android收到了默認的消息");

            }
        });


    }


    /**
     * 與服務器對接的原生方法
     *
     * @param jsons
     */
    public void sendinfo(String jsons) {

        try {
            JSONObject json = new JSONObject(jsons);
            String act = json.optString("act");//活動類型
            String id = json.optString("id");//跳轉用到的id
            String fun_reback = json.optString("fun_reback");//返回方法
            String returnurl = json.optString("returnurl");//回放鏈接

            if (StringUtils.isEmpty(act)) return;

            if (StringUtils.equals("live", act)) {//  
                HnLiveSwitchDataUitl.joinRoom(HnMyWebviewActivity.this, id, "");//跳轉普通直播間
            } 
 
            if (StringUtils.isNotEmpty(fun_reback,true)){  //
                //調用js方法必須在主線程
                webview.callHandler(fun_reback, jsons, new CallBackFunction() {//原生app給安卓給js發送數據
                    @Override
                    public void onCallBack(String data) {//來自web的回傳數據
                      
                    }
                });
            }
        } catch (JSONException e) {
            e.printStackTrace();
        }
    }


   

    /**
     * 創建json數據包,填充數據返回給服務器
     */
    private void makeJsonDataReturnServer(String str) {
        try {
            //解析js callback方法 數據
            JSONObject mJson = new JSONObject(str);
            String callback = mJson.optString("callback");//解析js回調方法

            //重新組裝方法
            JSONObject json = new JSONObject();

            json.put("name1", "value1");
            json.put("name2", "value2");

        } catch (JSONException e) {
            e.printStackTrace();
        }
    }

3.總結

以上代碼就是核心調用H5方法，交互的方法了，有部分交互方法沒用到，就沒寫出來，感興趣自己去找找該框架的方法及源碼。