Swift WKWebView 與JS互動

1.WKWebView調用JS方法（包括參數傳遞與回傳）

WKWebView方法

//jsmessage為js方法傳回值  err為錯誤資訊   jsHandlerFunc為JS中的方法   ---- 為webview傳遞給JS的參數
 webview.evaluateJavaScript("jsHandlerFunc(\"----\")") { (jsmessage, err) in
            
print(jsmessage)
}
複制代碼
           

JS方法

<script type="text/javascript">
      function jsHandlerFunc(message) {
          //顯示webview傳參（message） return "xxxxx" 為js回傳給webview的參數 (jsmessage)
            document.getElementById('js-content').innerHTML = "jsdajjadsfjsfjasdj" + message;
            return "xxxxx"
        }
</script>
複制代碼
           

還有一種方法是使用WKUserScript 大家自行研究

2.JS調用webview

WKWebView方法

webview.configuration.userContentController.add(self, name: "nativeMethod")

複制代碼
           

實作WKScriptMessageHandler協定下面的方法

func userContentController(_ userContentController: WKUserContentController, didReceive message: WKScriptMessage) {
        
        print(message)//WKScriptMessage對象
        print(message.name) //name : nativeMethod
        print(message.body) //js回傳參數
    }
複制代碼
           

JS方法

<script type="text/javascript">
      function nativeClick(){
        window.webkit.messageHandlers.nativeMethod.postMessage({body: 'paramters'});
    }
</script>
複制代碼
           

注意：要記得移除添加的nativeMethod 不然會引起記憶體洩露

webview.configuration.userContentController.removeScriptMessageHandler(forName:"nativeMethod")

複制代碼
           

那麼怎樣從js調用Swift的方法然後再得到傳回值呢

最笨的方法，js調用Swift 後，再用Swift調用js傳值