iOS获取WKWebView的高度

在iOS开发中获取webView高度是比较常用的,但是已知的几种方法里或多或少都有点问题。
先提供最终方案,下面还有几种方式可以看看。

最终方案 亲测可用

#pragma mark webView delegate
// 页面加载完成之后调用
- (void)webView:(WKWebView *)webView didFinishNavigation:(WKNavigation *)navigation {

    // 禁用用户选择
    [self.webView evaluateJavaScript:@"document.documentElement.style.webkitUserSelect='none';"completionHandler:nil];
    [self.webView evaluateJavaScript:@"document.documentElement.style.webkitTouchCallout='none';" completionHandler:nil];
    
    WEAKSELF;

    [webView evaluateJavaScript:@"document.body.scrollWidth" completionHandler:^(id _Nullable result,NSError *_Nullable error) {
        STRONGSELF
    //获取页面宽度
    //在全局属性定义一个宽度

        strongSelf.scrollWidth= [result doubleValue];

        NSLog(@"scrollWidth 即为所求:%ff", strongSelf.scrollWidth);
        WEAKSELF
        [webView evaluateJavaScript:@"document.body.scrollHeight"completionHandler:^(id _Nullable result,NSError*_Nullable error) {
            STRONGSELF
            //获取页面高度

            CGFloat scrollHeight = [result doubleValue];

            //计算出缩放比,屏幕宽除以webview宽

            CGFloat ratio =  CGRectGetWidth(self.webView.frame) /strongSelf.scrollWidth;

            //此处就能求出页面缩放比例后的高度

            //取到的高度在乘以缩放比即可得到准确高度

            double webHeight = scrollHeight * ratio;
            strongSelf.webCell.webContentHeight.constant = webHeight;
            strongSelf.webView.height = webHeight;
            [strongSelf.tableView reloadData];
        
        }];

    }];
    
}

其他获取高度方式:

1、网页代理加载完成时获取高度。(因为webView中包含图片等资源它们加载过程中需要一定时间,只有当它们完全加载完成以后,获取的高度才是真正的高度)
2、KVO方式获取。(可能会出现跳动,不停刷新,加载资源或图片需要时间)
3、在html中设置特殊标签。(没试过)

方法1:在webView的代理中去获取webView的高度

//WKWebView
- (void)webView:(WKWebView *)webView didFinishNavigation:(WKNavigation *)navigation{
    if (self.hud) {
        [self.hud hideAnimated:YES];
    }
    [webView evaluateJavaScript:@"document.body.scrollHeight"
              completionHandler:^(id result, NSError *_Nullable error) {
        [self.webView mas_updateConstraints:^(MASConstraintMaker *make) {
            make.height.equalTo([result floatValue]);
        }];
        self.tableView.tableHeaderView = self.headerView;
    }];
}

方法2:通过KVO监听webView的高度,然后更新高度。

//WKWebView
[self.webView.scrollView addObserver:self forKeyPath:@"contentSize" options:NSKeyValueObservingOptionOld | NSKeyValueObservingOptionNew context:nil];
//监听高度变化
- (void)observeValueForKeyPath:(NSString *)keyPath ofObject:(id)object change:(NSDictionary *)change context:(void *)context{
    if ([keyPath isEqualToString:@"contentSize"]) {
      
    }
}

方法3:在html中设置特殊标签。

这时候我们可以在 body标签内部再套一层标签, 然后再获取div的高度

- (void)webView:(WKWebView *)webView didFinishNavigation:(WKNavigation *)navigation {
    __weak typeof(self) weakSelf = self;
    [webView evaluateJavaScript:@"document.getElementById('bodybox').offsetHeight" completionHandler:^(id _Nullable m, NSError * _Nullable error) {
        CGFloat webHeight = [m floatValue];
        webView.frame = CGRectMake(0, 0, kScreenWidth, webHeight);
    }];
}

按照这个办法来做的话,就可以准确的获取到webview的高度了,无论字体从大到小还是从小到大,获取的高度都是正确的。

你可能感兴趣的:(iOS获取WKWebView的高度)