前言
WKWebView为了安全起见,禁止了web的弹窗显示,web端通过js的 alert,confirm,prompt不可以调用系统弹窗,所以需要实现WKUIDelegate协议来拦截并自定义是否弹窗。
一.alert,confirm,prompt与原生通信(传值 & 接收返回值)
alert("这是弹出框提示文本")
//不接收返回值:
confirm("这样写可以直接显示,不接收返回值。")
//接收返回值:
var x;
var r = confirm("请按下按钮!");
if (r == true){
x = "你按下的是\"确定\"按钮。";
}
else{
x = "你按下的是\"取消\"按钮。";
}
document.write(x)
//不显示默认文本:
prompt("开心吗?"); // 这个显示内容也可以不写,但就没有交互的意义了。
//显示默认文本:
var x;
var name = prompt("请输入你的名字","Keafmd");
if (name != null && person != ""){
x="你好! " + name + "。";
document.write(x)
二.通过WKUIDelegate实现js与native通信(拦截 & 回传数据)
WKUIDelegate中的代理方法主要涉及到界面显示的回调方法,原生控件支持,三种提示框:输入、确认、警告。首先将 js提示框拦截 然后做处理,处理完毕之后 通过block回调数据给js.
- 警告框(alert)
- (void)webView:(WKWebView *)webView runJavaScriptAlertPanelWithMessage:(NSString *)message initiatedByFrame:(WKFrameInfo *)frame completionHandler:(void (^)(void))completionHandler {
//TODO:自定义原生弹窗UIAlertView or not
//回调
completionHandler();
}
- 确认框(confirm)
- (void)webView:(WKWebView *)webView runJavaScriptConfirmPanelWithMessage:(NSString *)message initiatedByFrame:(WKFrameInfo *)frame completionHandler:(void (^)(BOOL result))completionHandler {
//TODO:自定义原生弹窗UIAlertView or not
//处理结果回传给js
completionHandler(YES);
}
- 输入框(prompt)
- (void)webView:(WKWebView *)webView runJavaScriptTextInputPanelWithPrompt:(NSString *)prompt defaultText:(nullable NSString *)defaultText initiatedByFrame:(WKFrameInfo *)frame completionHandler:(void (^)(NSString * _Nullable result))completionHandler {
//TODO:自定义原生弹窗UIAlertView or not
//处理结果回传给js
completionHandler(@"自定义字符串回传给js");
}
dsBridge就是通过该原理实现js与原生通信
DSBridge优势
- DSBridge真正跨平台!原版WebViewJavascriptBridge只支持ios,只不过有人在android上也实现了和WebViewJavascriptBridge相同的前端调用协议,所以可以在ios/android上使用同一套js调用协议,但本身来讲,WebViewJavascriptBridge ios和android平台并非一家之作,所以也并没有官方提供跨平台的技术支持,而DSBridge官方同时支持ios和android。
- DSBridge支持同步调用!这一点秒杀其它所有,可谓一骑绝尘。同步在复杂一点的应用中有多重要,相信使用过node的都应该深有感触。原文中有仔细说明,请移步http://www.jianshu.com/p/d967b0d85b97。
- 三端友好; 无论是在ios、android或者 web,使用起来都非常简单优雅,这一点和WebViewJavascriptBridge相比,简直就是艺术。
DSBridge为国人项目,有详细中文文档和问题反馈渠道。
网友评论