【实践】客户端JSBridge实现文档

目标

实现Native与JS页面的相互调用

JS从Native调取Token

JS调取Native跳转

Native调取当前JS里的消息信息、用户信息等

JS掉起Native支付页面，Native支付完成（失败）后回调给JS

实现框架（Android 、iOS、JS）

android参考：https://github.com/lzyzsd/JsBridge、https://github.com/hjhrq1991/JsBridge

iOS参考：https://github.com/LOVEGLXR/WebNewsJSBridgeOC

JS接入方法：参考android或iOS的任何一个即可

示例代码<支付>

H5

Android

1.根据桥名称 TJJavascriptBridge 注册 JsBridge

webView.setDefaultHandler(new DefaultHandler()); webView.setCustom("TJJavascriptBridge");

2.注册JS调用Native的方法：requestPay

webView.registerHandler("requestPay", (data, function) -> {     //跳转到支付页面});

3.支付完成（或失败）后回调JS

//微信支付成功通过EventBus回调 @Subscribe(threadMode = ThreadMode.MAIN) public void onPayEvent(PayEvent event) { if (event.isSuccess) { webView.callHandler("onPaySuccess", "", data -> { }); } else { webView.callHandler("onPayFail", event.failurReason, data -> { }); } }

iOS

1.引入 WebViewJavascriptBridge 并注册到 UIWebview

@property WebViewJavascriptBridge* bridge;[WebViewJavascriptBridge enableLogging];_bridge = [WebViewJavascriptBridge bridgeForWebView:_mWebView webViewDelegate:self handler:nil];

2.注册JS调用Native的方法：requestPay

[_bridge registerHandler:@"requestPay" handler:^(id data, WVJBResponseCallback responseCallback) {        //跳转到支付页面 }];

3.支付完成（或失败）后回调JS

- (void) onPaySuccess{    [_bridge callHandler:@"onPaySuccess"];}- (void) onPayFail{    [_bridge callHandler:@"onPayFail" data:@"失败原因:***"];}

【关注公众号发现更多精彩】

目标

实现框架（Android 、iOS、JS）

示例代码<支付>

H5

Android

iOS

更多相关文章

随机推荐

【实践】客户端JSBridge实现文档

目标

实现框架 （Android 、iOS、JS）

示例代码<支付>

H5

Android

iOS

更多相关文章

随机推荐

实现框架（Android 、iOS、JS）