iOS WKWebView가 포함 된 트윗이있을 때 부적절하게 높이를 계산합니다.

Question

내 앱에서 WKWebView를 사용하여 HTML 문자열을 표시합니다. WkWebView는 여러 다른 요소 (예 : 단추, tableViews)를 가지고 있기 때문에 scrollView에 포함되어 있습니다. 그 때문에 WkWebvView 콘텐츠의 크기를 계산해야하고 evaluateJavaScript ("document.body.scrollHeight", completionHandler : 메서드)를 사용해야합니다. HTML 문자열에 트윗을 포함 할 때마다 콘텐츠 높이가 잘못 계산되고 웹보기가됩니다. 높이의 조각을 잘라 같은 임베디드 모습을 트윗 한 HTML 문자열의

이

부 :. 내가 때문에 유래의 대체했다

<blockquote class=\"twitter-tweet\" data-lang=\"en\"><p><a href=\"https://twitter.com/hashtag/SYRIA?src=hash\">#SYRIA</a> Admiral Essen frigate launched <a href=\"https://twitter.com/hashtag/Kalibr?src=hash\">#Kalibr</a> cruise missiles against ISIS objects near Deir ez-Zor <a href=\"https://BLABLA*\">pic.twitter.com/azHAIii07g</a></p><p>— Минобороны России (@mod_russia) <a href=\"https://twitter.com/mod_russia/status/905007557554700288\">September 5, 2017</a></p></blockquote><p><script src=\"https://platform.twitter.com/widgets.js\"></script>

(BLABLA의 * 실제로 t.co/azHAIii07g입니다 규칙)

여기에 뭔가가이 트위터 코드에서 누락, 또는 내가 webview 메서드에서 뭔가를 설정해야합니까?

이 게시물의 솔루션 구현 시도 : iOS Calculate correct WKWebview height for html string with embeded tweet하지만 성공이 없거나 적어도 대답을 알아낼 수 있습니다.

모든 조언을 주시면 감사하겠습니다.

업데이트 : 조금 해킹하고 끔찍한 해결 방법을 찾았지만 문제가있는 곳에서 좋은 단서가되었습니다. 제가

넣으면

`func webView(_ webView: WKWebView, didFinish navigation: WKNavigation!) { 
    self.webViewx.evaluateJavaScript("document.readyState", completionHandler: { 
     [weak self] (complete, error) in 
     if complete != nil {    self?.webViewx.evaluateJavaScript("document.body.offsetHeight", completionHandler: { 
       [weak self] (height, error) in 

    }) 
}` 

: 이 난 높이 계산에 사용하는 모든 기능은

`DispatchQueue.main.asyncAfter(deadline: DispatchTime.now()+1, execute: { 
self?.webViewx.evaluateJavaScript("document.body.offsetHeight", completionHandler: { 
[weak self] (height, error) in 
print("HEIGHT AFTER 1 sec", height) 
    }) 
})` 

I 1 초 후에 정확한 높이를 얻는다. 이제 정확한 시간 후에 높이를 업데이트하는 방법은 무엇입니까?

또 하나의 사이드 노트, 내가 페이스 북이나 인스 타 그램 포스트를 포함한다면, 모든 것이 제대로 작동하고 webview 높이가 올바르게 계산됩니다.

Answer 1

stackoverflow (특히 : Twitter Uncaught TypeError: undefined is not a function)에 대한 여러 도움말과 웹 개발자 인 동료와 함께이 문제에 대한 해결책을 찾을 수있었습니다. 기본적으로 웹보기를로드해야하는 html 문자열에 포함 된 트윗이있는 경우 스크립트를 webview 구성에 추가하는 것이 좋습니다. 그 다음에 우리는 userContentController didReceive 메시지 함수를 구현해야하며 그 안에는 webview의 높이를 평가해야합니다. html로 문자열이 포함 된 트윗 수있는 문자열이있는 경우

가

if htmlString.contains("platform.twitter.com/widgets.js") { 
     let twitterJS: String = "window.twttr = (function(d, s, id) {var js, fjs = d.getElementsByTagName(s)[0],t = window.twttr || {};if (d.getElementById(id)) return t;js = d.createElement(s);js.id = id;js.src = \"https://platform.twitter.com/widgets.js\";fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, \"script\", \"twitter-wjs\"));twttr.ready(function (twttr) {twttr.events.bind('loaded', function (event) {window.webkit.messageHandlers.callbackHandler.postMessage('TWEET');});});" 
     let userScript = WKUserScript(source: twitterJS, injectionTime: .atDocumentEnd, forMainFrameOnly: false) 
     webViewx.configuration.userContentController.removeAllUserScripts() 
     webViewx.configuration.userContentController.addUserScript(userScript) 
     webViewx.configuration.userContentController.add(self, name: "callbackHandler") 
    } 

먼저 체크가 : 여기

는 webview.loadHtmlString 방법 전에 가야 코드입니다. twitterJS가 트위터 웹 페이지에서 가져온 것입니다. 마지막 줄은 스크립트에 이름을주는 의미에서 중요합니다.

실제 높이 평가는 다음과 같이 수행됩니다

func userContentController(_ userContentController: WKUserContentController, didReceive message: WKScriptMessage) { 
    if message.name == "callbackHandler" { 
     print(message.body) 
     webViewx.evaluateJavaScript("document.body.offsetHeight", completionHandler: { (height, error) in 
      if let error = error { 
       print(error.localizedDescription) 
       return 
      } 
      if let height = height as? CGFloat{ 
       if height > self.kontejnerHeight.constant { 
        self.kontejnerHeight.constant = height 
       } 

      } 
     }) 
    } 
} 

는 희망이뿐만 아니라 다른 사람을 도움이 될 것입니다.