摘要：第一個用于調用沒有返回值的函數，沒有參數時傳即可。第二個用于需要返回值的場景，需要傳遞一個接口對象，在方法中處理返回值即可。

DSBridge是目前地球上最好的IOS/Android   javascript bridge. 沒有之一！

DSBridge 是H5頁面與Native之間通信的橋梁，它有如下特點：

跨平臺；同時支持ios和android。

雙向調用；js可以調用native， native可以調用js

不僅支持異步調用，而且頁支持同步調用（dsbridge是唯一一個支持同步調用的javascript bridge）

支持進度回調，多次返回（常用于文件下載進度、計時器等）

Android支持騰訊x5內核

三端易用；無論是前端還是android或ios，使用都非常簡單，極大的降低集成／學習成本

與WebViewJavascriptBridge的對比請移步 DSBridge VS WebViewJavascriptBridge

添加 JitPack repository

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

添加依賴

dependencies {
    
     compile "com.github.wendux:DSBridge-Android:2.0-SNAPSHOT"

    //  使用騰訊x5內核的使用該版本
    // compile "com.github.wendux:DSBridge-Android:x5-SNAPSHOT"
    
    // 主線版本
    //compile "com.github.wendux:DSBridge-Android:master-SNAPSHOT"
}

假設Native端實現了兩個api: testSyn、testAsyn。參數以json傳遞， testSyn為同步api,執行結束后會直接返回結果，而testAsyn為一個異步api(可能會執行耗時操作)，執行結束后，結果異步返回。

Java中實現 API

public class JsApi{
    //用于同步調用
    @JavascriptInterface
    String testSyn(JSONObject jsonObject) throws JSONException {
        // The return value type can only be  String
        return jsonObject.getString("msg") + "［syn call］";
    }
    //用于異步調用
    @JavascriptInterface
    void testAsyn(JSONObject jsonObject, CompletionHandler handler) throws JSONException {
        handler.complete(jsonObject.getString("msg")+" [asyn call]");
    }
}

為了安全起見，所有的API都必須有 “JavascriptInterface” 標注。

將實現的API安裝到 DWebView

import wendu.dsbridge.DWebView
...
DWebView dwebView= (DWebView) findViewById(R.id.dwebview);
dwebView.setJavascriptInterface(new JsApi());

在h5頁面中調用 Java API

初始化 dsBridge

//cdn
//
//npm
//npm install dsbridge
var dsBridge=require("dsbridge")

調用 API

// 同步調用
var str=dsBridge.call("testSyn", {msg: "testSyn"});

// 異步調用
dsBridge.call("testAsyn", {msg: "testAsyn"}, function (v) {
  alert(v);
})

Native 調用 h5 中的 javascript API

Javascript 注冊供 Native調用的 API

// 注冊一個加法函數供 Native 調用
 dsBridge.register("addValue",function(l,r){
     return l+r;
 })

在 Java 中調用 javascript API

webView.callHandler("addValue",new Object[]{1,"hello"},new OnReturnValue(){
       @Override
       public void onValue(String retValue) {
          Log.d("jsbridge","call succeed,return value is "+retValue);
       }
});

注意：Native調用javascript API時必須在 "PageFinished"之后進行

IOS中的使用方式請參考 DSBridge-IOS 。

"dsBridge" 是一個全局對象, 在h5頁面中初始化DSBridge后便會可用，它有兩個方法 "call" 和 "register";

功能：調用Native api

method: api函數名

args:參數，類型：json, 可選參數

callback(String returnValue):僅調用異步api時需要.

同步調用

如果你是一名經驗豐富的開發者，想必看到第二行時已然眼睛一亮，想想node最被詬病的是什么，目前跨平臺的jsbridge中沒有一個能支持同步，所有需要獲取值的調用都必須傳一個回調，如果調用邏輯比較復雜，必將會出現“callback hell”。然而，DSBridge徹底改變了這一點。支持同步是DSBridge的最大亮點之一。

異步調用

對于一些比較耗時的api, DSBridge提供了異步支持，正如上例第三行代碼所示，此時你需要傳一個回調（如果沒有參數，回調可作為第二個參數），當api完成時回調將會被調用，結果以字符串的形式傳遞。

注冊 javascript API 供Native調用

為了兼容 Android和IOS?，DSBridge對Native API的簽名有兩個要求：

返回值必須是 String， 如果沒有返回值，直接返回null就行

API的參數通過 JSONObject傳遞，如果有些API沒有參數，你也需要申明。

?

通常情況下，調用一個方法結束后會返回一個結果，是一一對應的，現在，我們來思考如下場景：

有一個嵌入到app中顯示文檔下載列表的網頁。要求點擊網頁中相應文件對應的下載按鈕后，開始下載文件，并在該網頁中顯示下載進度。

思考：我們將文件下載的功能在natvie端實現，當點擊網頁上的某項時，我們通過js調用native的下載方法，native在下載的過程中，不斷的向js返回進度, 然后js更新網頁上的進度條，等到下載任務結束時，才算本次調用結束。而這種調用的特征就是js的一次調用，對應native的“多次返回”，考慮到native很多耗時任務都可能會多次返回（比如返回進度），DSBridge 對“多次返回”進行了支持，使用DSBridge 就可以非常方便的應對這種case了。

詳細的示例請參考 DSBridge實例－在網頁中展示Native進度

DWebView提供了三個api用于調用js

void callHandler(String method, Object[] args) 
void callHandler(String method, Object[] args, CompletionHandler handler)
void evaluateJavascript(String script)

前兩個api中，method 為函數名，args為參數數組，可以接受String 、int 、long、float、double等。

第一個api用于調用沒有返回值的js函數，沒有參數時傳null即可。

第二個api用于需要返回值的場景，需要傳遞一個CompletionHandler接口對象，在complete(String returnValue)方法中處理返回值即可。

第三個api用于執行任意js代碼，內部已做版本兼容處理。

調用時機

DWebview只有在javascript context初始化成功后才能正確執行js代碼，而javascript context初始化完成的時機一般都比整個頁面加載完畢要早，隨然DSBridge能捕獲到javascript context初始化完成的時機，但是一些js api可能聲明在頁面尾部，甚至多帶帶的js文件中（請務必不要這么做），如果在javascript context剛初始化完成就調用js api, 此時js api 可能還沒有注冊，所以會失敗，綜上所述，如果是客戶端主動調用 js應該在onPageFinished后調用。簡單的示例如下：

webView.setWebViewClient(new WebViewClient(){
    @Override
    public void onPageFinished(WebView view, String url) {
        super.onPageFinished(view, url);
        //期望返回值
        webView.callHandler("test",new Object[]{1,"hello"},new CompletionHandler(){
            @Override
            public void complete(String retValue) {
                Log.d("jsbridge","call succeed,return value is "+retValue);
            }
        });
        //不期望返回值
        webView.callHandler("test",null);
    }
});

DWebview中下列函數會在主線程中執行，您不必在手動切換線程

void loadUrl( String url) 
void loadUrl(final String url, Map additionalHttpHeaders)
void evaluateJavascript(String script) 

DWebview已經實現 alert、prompt、comfirm對話框，您可以不做處理，也可以自定義。

如果你喜歡，歡迎star！
github:
android: https://github.com/wendux/DSB...
ios: https://github.com/wendux/DSB...