WKWebView高度計算
近期有一個需求需要在View的某一個區域插入一段H5的內容，這段內容是服務端下發的，相信很多同僚都做過類似的需求，現在就把本人做這個需求的經歷記錄下來，希望對大家有所幫助。
這個需求的難點是下發的H5內容高度是變化的，根據服務端下發內容的不同，WebView會有不同的高度。所以關鍵點也是在拿到服務端內容進行WebView載入完成之後，計算出WebView的高度，並且設定為對應的值即可。
在網上找了很多資料，大多數的都是如下的方式，在 func webView(_ webView: WKWebView, didFinish navigation: WKNavigation!) 代理方法中新增如下程式碼
func webView(_ webView: WKWebView, didFinish navigation: WKNavigation!) {
webView.evaluateJavaScript("document.body.offsetHeight") { result, _ in
if let height = result as? CGFloat {
var frame = webView.frame
frame.size.height = height
webView.frame = frame
}
}
}
上面的方式在大多數的時候是有效正確的，但我遇到了一些情況還是計算的有問題。經過不斷的查閱資料，還是找到了一個更準確的計算方式，方式基本和上面是一樣的，呼叫的JS不一樣，使用 document.documentElement.offsetHeight，程式碼如下
func webView(_ webView: WKWebView, didFinish navigation: WKNavigation!) {
webView.evaluateJavaScript("document.documentElement.offsetHeight") { result, _ in
if let height = result as? CGFloat {
var frame = webView.frame
frame.size.height = height
webView.frame = frame
}
}
}
至於原因，大致可以如下理解：document.documentElement.offsetHeight >= document.body.offsetHeight，具體詳情可以參考 這裡，這裡描述了 offsetHeight 在各個節點及各個瀏覽器的一些差異。
還有一點要注意：初始化webView的時候，高度要設定為0，寬度需要設定成需要的寬度