04. [iOS/swift] WKWebView에서 JavaScript의 console.log 보기

xcode 콘솔창에서 JavaScript의 console.log 내용을 표시하는 extension을 작성했습니다.

 

아래 코드를 프로젝트 안에 입력한뒤 필요한 장소에서 webView.enableConsoleLog() 라는 함수를 호출해주면,  JavaScript의 console.log의 내용이 xcode의 디버그 윈도우에 표시됩니다.

 

 

 

상세코드

import WebKit

/// adding "console.log" support
extension WKWebView: WKScriptMessageHandler {

    /// enabling console.log
    public func enableConsoleLog() {

        // set message handler
        configuration.userContentController.add(self, name: "logging")

        // override console.log
        let _override = WKUserScript(source: "var console = { log: function(msg){window.webkit.messageHandlers.logging.postMessage(msg) }};", injectionTime: .atDocumentStart, forMainFrameOnly: true)
        configuration.userContentController.addUserScript(_override)
    }

    /// message handler
    public func userContentController(_ userContentController: WKUserContentController, didReceive message: WKScriptMessage) {
        print("WebView: ", message.body)
    }
}

 

 

 

extension code를 추가

 

 

필요한 부분에서 webView.enableConsoleLog()라는 함수를 호출하여 사용

 

 

디버그 윈도우에 WebView: console.log 내용이 출력되는 것을 확인할 수 있음