WKWebView
是Apple
在iOS8推出的Webkit
框架中的负责网页的渲染与展示的类,相比UIWebView
速度更快,占用内存更少,支持更多的HTML
特性。
JS调用iOS:
实现逻辑:点击JS的登录按钮,JS将登录成功后的token数据传递给iOS,iOS将收到的数据展示出来。
-
实现效果:
image JS代码:
//! 登录按钮
<button onclick = "login()" style = "font-size: 18px;">登录</button>
//! 登录
function login() {
var token = "js_tokenString";
loginSucceed(token);
}
//! 登录成功
function loginSucceed(token) {
var action = "loginSucceed";
jsToOc(action, token);
}
//! JS调用OC入口
function jsToOc(action, params) {
var url = "jsToOc://" + action + "?" + params;
loadURL(url);
}
//! 加载URL
function loadURL(url) {
window.location.href = url;
}
- iOS代码:
#pragma mark - WKNavigationDelegate
//! WKWeView在每次加载请求前会调用此方法来确认是否进行请求跳转
- (void)webView:(WKWebView *)webView decidePolicyForNavigationAction:(WKNavigationAction *)navigationAction decisionHandler:(void (^)(WKNavigationActionPolicy))decisionHandler {
if ([navigationAction.request.URL.scheme caseInsensitiveCompare:@"jsToOc"] == NSOrderedSame) {
[WKWebViewInterceptController showAlertWithTitle:navigationAction.request.URL.host message:navigationAction.request.URL.query cancelHandler:nil];
decisionHandler(WKNavigationActionPolicyCancel);
}
else {
decisionHandler(WKNavigationActionPolicyAllow);
}
}
- 实现原理:
1、JS与iOS约定好jsToOc
协议,用作JS在调用iOS时url的scheme
;
2、JS在登录成功后加载含有token数据的url:(jsToOc://loginSucceed?js_tokenString)
;
3、iOS的WKWebView在请求跳转前会调用-webView:decidePolicyForNavigationAction:decisionHandler:
方法来确认是否允许跳转;
4、iOS在此方法内截取jsToOc
协议获取JS传过来的数据,用UIAlertController
显示出来,并通过decisionHandler
不允许此请求跳转。
PS1:除了显示截取到的数据,iOS还可以将
navigationAction.request.URL.host
看作JS想调用的方法名,将navigationAction.request.URL.query
看作该方法的参数集,从而体现出JS调用iOS
的概念。
PS2:在-webView:decidePolicyForNavigationAction:decisionHandler:
方法中一定要调用decisionHandler
回调来制定允许请求跳转WKNavigationActionPolicyAllow
或者不允许跳转WKNavigationActionPolicyAllow
,不然会崩溃。