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

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

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

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

雙向調(diào)用；js可以調(diào)用native， native可以調(diào)用js

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

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

Android支持騰訊x5內(nèi)核

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

與WebViewJavascriptBridge的對比請移步 DSBridge VS WebViewJavascriptBridge

添加 JitPack repository

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

添加依賴

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

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

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

Java中實現(xiàn) API

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

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

將實現(xiàn)的API安裝到 DWebView

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

在h5頁面中調(diào)用 Java API

初始化 dsBridge

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

調(diào)用 API

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

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

Native 調(diào)用 h5 中的 javascript API

Javascript 注冊供 Native調(diào)用的 API

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

在 Java 中調(diào)用 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調(diào)用javascript API時必須在 "PageFinished"之后進行

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

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

功能：調(diào)用Native api

method: api函數(shù)名

args:參數(shù)，類型：json, 可選參數(shù)

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

同步調(diào)用

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

異步調(diào)用

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

注冊 javascript API 供Native調(diào)用

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

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

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

?

通常情況下，調(diào)用一個方法結(jié)束后會返回一個結(jié)果，是一一對應(yīng)的，現(xiàn)在，我們來思考如下場景：

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

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

詳細的示例請參考 DSBridge實例－在網(wǎng)頁中展示Native進度

DWebView提供了三個api用于調(diào)用js

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

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

第一個api用于調(diào)用沒有返回值的js函數(shù)，沒有參數(shù)時傳null即可。

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

第三個api用于執(zhí)行任意js代碼，內(nèi)部已做版本兼容處理。

調(diào)用時機

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

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中下列函數(shù)會在主線程中執(zhí)行，您不必在手動切換線程

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

DWebview已經(jīng)實現(xiàn) alert、prompt、comfirm對話框，您可以不做處理，也可以自定義。

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