DSBridge的简说

源码下载地址：

JS端源码只有到npm上下载，GitHub上没有...
DSBridge 三端易用啥的，咱就不帮作者吹了，就简单说说...

无空间名部分

一、初始化

JS端

//cdn
//<script src="https://cdn.jsdelivr.net/npm/dsbridge@3.1.4/dist/dsbridge.js"> //</script>
//npm
//npm install dsbridge@3.1.4
var dsBridge=require("dsbridge")

iOS端

新建一个继承于NSObject的类，类名如JsApiTest，对应的JS调用原生会回调到JsApiTest中的testAsyn的函数中：

#import "dsbridge.h"
...
@implementation JsApiTest
//for synchronous invocation
- (NSString *) testSyn:(NSString *) msg
{
    return [msg stringByAppendingString:@"[ syn call]"];
}
//for asynchronous invocation
- (void) testAsyn:(NSString *) msg :(JSCallback)completionHandler
{
    completionHandler([msg stringByAppendingString:@" [ asyn call]"],YES);
}
@end

UIViewController

self.javascriptBridge = [[JsApiTest alloc] init];
[self.webView addJavascriptObject:self.javascriptBridge namespace:nil];

Android端

新建一个Java类，实现API，对应的JS调用原生会回调到JsApiTest中的testAsyn的函数中：

public class JsApi{
    //同步API
    @JavascriptInterface
    public String testSyn(Object msg)  {
        return msg + "［syn call］";
    }

    //异步API
    @JavascriptInterface
    public void testAsyn(Object msg, CompletionHandler<String> handler) {
        handler.complete(msg+" [ asyn call]");
    }
}

添加API类实例到 DWebView

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

二、交互

JS端

// 同步
var str=dsBridge.call("testSyn","testSyn");

// 异步
dsBridge.call("testAsyn","testAsyn", function (v) {
  alert(v);
})

OC端

[dwebview callHandler:@"testAsyn" arguments:@[@3,@4] completionHandler:^(NSNumber* value){
        NSLog(@"%@",value);
}];

Android端

dwebView.callHandler("testAsyn",new Object[]{3,4},new OnReturnValue<Integer>(){
     @Override
     public void onValue(Integer retValue) {
        Log.d("jsbridge","call succeed,return value is "+retValue);
     }
});

三、说明

JS中的异步方法dsBridge.call("testSyn","testSyn");其中连续两个testSyn参数，所代表的意思是不同的，第一个参数testSyn是指移动端所实现的函数方法名，例如OC的是通过objc_msgSend指定到JsApiTest类中的- (void) testAsyn:(NSString *) msg :(JSCallback)completionHandler。

- (void) testAsyn:(NSString *) msg :(JSCallback)completionHandler 如果在JS调用原生的时候，需要有回调的时候可以直接completionHandler回去，如果不需要则无需completionHandler。

空间名部分

命名空间可以帮助你更好的管理API，这在API数量多的时候非常实用，比如在混合应用中。DSBridge (>= v3.0.0) 支持你通过命名空间将API分类管理，并且命名空间支持多级的，不同级之间只需用'.' 分隔即可。（复制dsbridge文档，笔者表示复制粘贴解决一切...）

初始化

JS端

初始化与无空间名一致

OC端

在UIViewController 中
UIViewController，注册JavascriptObject时写上三端协商好的空间名。

self.javascriptBridge = [[JsApiTest alloc] init];
[self.webView addJavascriptObject:self.javascriptBridge namespace:@"namespace"];

Android端

类似iOS端在注册JavascriptObject时写上三端协商好的空间名。

交互

JS端

dsBridge.call("namespace.nativeMethod",{action:"getSourceSign",data:"1111"},function (ret) {
    alert(JSON.stringify(ret));
})

OC端

与无空间的实现一致。

Android端

与无空间的实现一致。

说明

主要是JS端的区别由原本两个参数分别代表原生端的函数名、交互协议名，变为namespace.naviteMethod，另外携带的交互message上差不多，看各自的约定哈。

结语

大概就讲这些，别的自己看文档，下载demo查看哈。这边就大概简单的说一下下...

最后编辑于：2020.06.11 16:49:44