WKWebView使用之OC调用JS
2017-03-28 本文已影响3524人
齐小天_Liu
在前面我们讲了JS调用OC的方法，今天再来探讨一下OC调用JS的方法。这里我们同样使用的是WKWbView。
1.首先我们来看一下html部分的代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>OC调用JS</title>
<script type="text/javascript">
function alertMessage(message) {
alert(message);
}
</script>
</head>
<body>
</br></br></br></br>
<!-- <button type="button" onclick="alertMessage()">showAlert</button>-->
</body>
</html>
html部分非常简单，只是定义了一个alertMessage方法，为了让OC调用该方法，弹出message。
2.下面看一下OC端方法的实现。
首先要实例化一个WKWebView，这里如果没有JS调用OC的功能的话，就需要配置WKWebViewConfiguration，对于WKWebView的实例化这里就不再赘述。
接下来就是对JS方法的调用，我们在需要调用JS方法的位置加上下面代码：
[self.webView evaluateJavaScript:@"alertMessage('hello')" completionHandler:^(id _Nullable item, NSError * _Nullable error) {
NSLog(@"alert");
}];
其中alertMessage('hello')就是html中预留的方法，completionHandler会在JS方法执行完后执行。
这样就能实现OC调用JS 方法，但是当我们运行的时候我们会发现，并没有出现弹框，这是为什么呢？在前面的WKWebView使用之WKUIDelegate中，我们已经说过，当使用WKWebView时，html的弹窗将不会再显示，那想显示弹窗，我们需要实现WKUIDelegate的代理方法，代码如下：
首先要遵守WKUIDelegate代理：
_webView.UIDelegate = self;
接下来实现代理方法：
#pragma mark WKUIDelegate
- (void)webView:(WKWebView *)webView runJavaScriptAlertPanelWithMessage:(NSString *)message initiatedByFrame:(WKFrameInfo *)frame completionHandler:(void (^)(void))completionHandler
{
UIAlertController *alert = [UIAlertController alertControllerWithTitle:@"Warning" message:message preferredStyle:UIAlertControllerStyleAlert];
UIAlertAction *action = [UIAlertAction actionWithTitle:@"ok" style:UIAlertActionStyleCancel handler:^(UIAlertAction * _Nonnull action) {
completionHandler();//此处的completionHandler()就是调用JS方法时，`evaluateJavaScript`方法中的completionHandler
}];
[alert addAction:action];
[self presentViewController:alert animated:YES completion:nil];
}
这样，弹窗就会显示出来了，而且是iOS自己的原生弹窗，我们可以通过自己的需求，对其进行定制。
