WKWebView是苹果在iOS 8之后推出的框架，关于它比webview的优势这里就不讲了。主要说一下与JS交互的问题，其实WKWebView已经内置了JS与OC的互调、传值等方法，使用起来也非常方便，下面就来细细的探讨一下以及自己遇到过的坑
首先来看下WKWebView的初始化相关设置：
一、导入相关头文件、设置相关代理和属性
二、WKWebView初始化
注意:
楼主遇到的第一个坑：如果JS给OC传值为空，必须写成: postMessage(null)，如果什么都不写，方法是调不通的。
1、在viewWillAppear中配置， addScriptMessageHandler name: "这里就是JS的方法，方法名必须统一"
楼主遇到的第二个坑：配置完后必须在 viewWillDisappear 中 remove，否则会造成循环引用，导致crash
2、实现 WKScriptMessageHandler 协议
以上就是JS调OC，JS向OC传值
楼主这里举三个例子：
1: webview加载完成前，将用户信息传给js
2: webview加载完成，将相关信息传给js
3: 调用相册或相机时，将选择的请求后台接口，后台返回地址，将该地址回传给H5，H5将显示到页面上
第一个例子: webView加载完成前传值
因为 evaluateJavaScript 方法默认是在加载完成后调用，所以直接在页面开始加载中调用是传不过去的，这个时候怎么办呢？ 我们可以让js端写两个方法， 第一个方法是js端开始向oc端发起信息需求的方法名，当oc端收到该方法名的时候，就去调用js端第二个获取传值的方法，把信息传递过去。
先让JS端写个方法调OC，OC实现方法后在这个方法内部给JS传值
在WKScriptMessageHandler协议中，实现该方法，然后在方法内部给JS传值
注意： 以上就是在Webview加载完成前传值，如果打印没报错，证明传参成功，如果web端没收到，让他把获取到值的方法写到页面中即可。
第二个例子: webView加载完成,传值给js
第三个例子: 传地址给js，js拿到后显示
1：拍照事件
11：将拍的照片请求上传接口，成功返回地址，并传值给H5
2: 从相册中选取照片
22：将相册中选取的照片请求上传接口，成功返回地址，并传值给H5
注意: getPhotoCallback 即为调用的方法名，后面传值格式必须为: ('') ， 这里遇到了第三个坑， 如果方法名写为: 名称名称 (例如：hello getPhotoCallback)，这种是调不通的，可以写成hello_getPhotoCallback的形式，一般的话最好还是定义一个完整的名称。 刚开始这个问题卡了比较久，一直调不通，在此记录一下
在 viewDidLoad 中注册进度条监听
开始加载网页
加载完成
加载失败
页面跳转失败
progressView懒加载
添加监听观察者
最后别忘记 removeObserver
Demo地址: >
在iOS中使用WKWebView加载网页成功后需要增加无网络和加载失败的处理，但是在didFail和didFailProvisionalNavigation方法都没有执行，后来发现必须实现
func webView(_ webView: WKWebView, decidePolicyFor navigationAction: WKNavigationAction, decisionHandler: @escaping (WKNavigationActionPolicy) -> Void) {
decisionHandler(WKNavigationActionPolicyallow);
}
上述方法才会执行。
改方法的含义是:返回内容之后，是否允许加载,返回WKNavigationActionPolicyallow则为允许加载。
WebView(网络视图)能加载显示网页，可以将其视为一个浏览器。它使用了WebKit渲染引擎加载显示网页，实现WebView有以下两种不同的方法：
第一种方法的步骤：
1在要Activity中实例化WebView组件：WebView webView = new WebView(this);
2调用WebView的loadUrl()方法，设置WevView要显示的网页：
互联网用：webViewloadUrl(">
WebView提供的loadData(String data , String mimeType , String encoding)方法，该方法可用于加载并显示HTML代码，但在实际使用过程中，当它加载包含中文HTML内容时，WebView将会显示乱码。
WebView还提供了一个loadDataWithBaseURL(String baseUrl , String data , String mimeType , String encoding , String historyUrl)方法,该方法是loadData(String data , String mimeType , String encoding)方法的增强版，它不会产生乱码。
1、data：指定需要加载的HTML代码。
2、mimeType：指定HTML代码的MIME类型，对于HTML代码可指定为text/html。
3、encoding：指定HTML代码编码所用的字符集。比如指定为GBK。
import androidosBundle;
import androidappActivity;
import androidviewMenu;
import androidwebkitWebView;
public class ViewHtml extends Activity {
WebView show;
@Override
protected void onCreate(Bundle savedInstanceState) {
superonCreate(savedInstanceState);
setContentView(Rlayoutactivity_view_html);
//获取程序中的WebView组件
show = (WebView) findViewById(Ridshow);
StringBuilder sb = new StringBuilder();
//拼接一段HTML代码
sbappend("<html>");
sbappend("<head>");
sbappend("<title>欢迎你</title>");
sbappend("</head>");
sbappend("<body>");
sbappend("<h2>111</h2>");
sbappend("</body>");
sbappend("</html>");
//使用简单的loadData方法会导致乱码，可能是Android API的Bug
//showloadData(sbtoString(), "text/html", "utf-8");
//加载、并显示HTML代码
showloadDataWithBaseURL(null,sbtoString(), "text/html", "utf-8", null);
}
}
最近遇到关于获取webview加载网页上的点击事件，三种解决方式～～～
一、跟后台协商好，点击该按钮加载特定url，通过webview的代理方法- (BOOL)webView:(UIWebView )webView shouldStartLoadWithRequest:(NSURLRequest )request navigationType:(UIWebViewNavigationType)navigationType 判断加载的url是否是协商好的url；
ps:记得要return NO，否则会加载url
二、通过获取所点击按钮的来判断是否点击特定位置
1、给webview的scrollview添加手势
2、实现UIGestureRecognizerDelegate代理方法
documentelementFromPoint 是获取点击坐标的元素
三、通过注入一段JS（需跟web前端协商），返回一段json数据
1、在webview加载完后注入js（具体根据需求定义）
例子：
2、拦截自定义的字段 kqapp://
@protocol UIWebViewDelegate <NSObject>
@optional
- (BOOL)webView:(UIWebView )webView shouldStartLoadWithRequest:(NSURLRequest )request navigationType:(UIWebViewNavigationType)navigationType;
- (void)webViewDidStartLoad:(UIWebView )webView;
- (void)webViewDidFinishLoad:(UIWebView )webView;
上面是webView 的代理方法，你遵循代理之后 如果webVIew 加载完毕，将会调用
- (void)webViewDidFinishLoad:(UIWebView )webView{
// do something 请采纳，有问题请追问
}
以上就是关于iOS WKWebView与H5交互，JS调OC传值、OC调JS传值、进度条加载等(干货满满)全部的内容，包括:iOS WKWebView与H5交互，JS调OC传值、OC调JS传值、进度条加载等(干货满满)、WebView如何判断页面真正成功加载、iOS中WKWebView加载网页失败或者无网络状态判断等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）