iOS开发(OC)iOS

【潮汐】iOS-WKWebView获取高度终极版

2018-12-19  本文已影响7人  爱恨的潮汐

前言:

WKWebView在iOS上获取高度不准这个问题困扰了很久,网上查了好多方法,在复杂场景下都会偶尔不准。最终这样解决:【iOS+H5获取网页高度然后回传给iOS】
1、KVO获取--->偶尔不准:

[self. webView.scrollView addObserver:self forKeyPath:@"contentSize" options:NSKeyValueObservingOptionNew context:nil];

2、网页加载完成后获取--->偶尔不准:

//网页加载完成
//页面加载完后获取高度,设置脚,注意,控制器里不能重写代理方法,否则这里会不执行
- (void)webView:(WKWebView *)webView didFinishNavigation:(WKNavigation *)navigation{
    
    
    // 不执行前段界面弹出列表的JS代码,关闭系统的长按保存图片
    [self evaluateJavaScript:@"document.documentElement.style.webkitTouchCallout='none';" completionHandler:nil];
    
   
    //    document.body.scrollHeight(不准)   document.body.offsetHeight;(好)
    [webView evaluateJavaScript:@"document.body.offsetHeight;" completionHandler:^(id Result, NSError * error) {
      NSString *heightStr = [NSString stringWithFormat:@"%@",Result];
            
            //必须加上一点
            CGFloat height = heightStr.floatValue+15.00;
            //网页加载完成
           NSLog(@"新闻加载完成网页高度:%f",height);    
}

当然UIWebView也有这些方法,最终获取都偶尔不准,也可以用如下方法解决。

下面是终极解决办法【iOS+H5获取网页高度然后回传给iOS】:

注意事项:

(1)H5那边一定要在文字跟图片都加载完成再去获取高度,因为图片是异步加载的,否则获取到的高度不准。
(2)H5返回来的高度直接使用就可以,不需要进行任何px、pt乱七八糟的单位换算。

1、初始化

  //(1)进行配置控制器---跟H5交互用
WKWebViewConfiguration *configuration = [[WKWebViewConfiguration alloc] init];
//实例化对象
configuration.userContentController = [WKUserContentController new];
 WKWebView * webView = [[WKWebView alloc]initWithFrame:CGRectMake(0, 0, SCREEN_WIDTH, 10)];

//(2)与JS交互的注册,JS调用OC方法--注册前先z初始化上面方法
    [webView.configuration.userContentController addScriptMessageHandler:self name:@"getWkWebViewHeight"];

 //(3)加载url
  [webView loadRequest:[NSURLRequest requestWithURL:[NSURL URLWithString:self.urlString]]];


//(4)HTML内容从后台请求完成后传给H5--js,等待H5加载完页面给iOS回调高度【注意:H5那边一定要在图片也加载完后才返回高度,不然返回的高度不准】
    NSString * HtmlStr = @"<p>HTML内容</p>
";
  NSDictionary *dicData = @{@"content": HtmlStr};
    //字典转JSON
    NSString * jsonStr = [NSDictionary dictionaryToJson:dicData];
    NSString *js = [NSString stringWithFormat:@"window.dataInfo = %@", jsonStr];
    WKUserScript *script = [[WKUserScript alloc] initWithSource:js injectionTime:(WKUserScriptInjectionTimeAtDocumentStart) forMainFrameOnly:YES];
    [[self configuration].userContentController addUserScript:script];

 

2、接收H5返回的高度,然后刷新tableView

//得到js传输回来的数据
//WKScriptMessageHandler协议方法
- (void)userContentController:(WKUserContentController *)userContentController didReceiveScriptMessage:(WKScriptMessage *)message {
    //code
//    NSDictionary *dictData = [NSDictionary jsonToDictionaryWithJsonString:message.body];
    
    if ([message.name isEqualToString:@"getWkWebViewHeight"]) {
     
        NSLog(@"获取新闻高度:%@",message.body);
        if ([self.typeString isEqual:@"新闻详情"]) {
            NSString * strHeight = [NSString stringWithFormat:@"%@",message.body];
            CGFloat heightWeb = [strHeight doubleValue];//得到网页高度
            //网页高度回调
            if (self.WebviewHeight) {
                self.WebviewHeight(heightWeb);
            }
        }
    }
    
}

结束--欢迎大家提出宝贵的意见。

上一篇下一篇

猜你喜欢

热点阅读