阅读 wkwebview Console.log答案

【问题标题】：Read wkwebview Consol.log阅读 wkwebview Console.log
【发布时间】：2019-02-16 08:21:34
【问题描述】：

我有 Web 视图应用程序并尝试在我的应用程序中读取所有 javascript Console.log 和单击 Web 视图事件

我写了这段代码，当按钮被点击时转到 userContentController 委托，但是当有消息时什么都没有发生

let config = WKWebViewConfiguration()
        let source = """
        document.addEventListener('click', function(){ window.webkit.messageHandlers.iosListener.postMessage('click clack!'); })
        document.addEventListener('message', function(e){
            window.webkit.messageHandlers.iosListener.postMessage(e.data); })
        })
        """
        let script = WKUserScript(source: source, injectionTime: .atDocumentEnd, forMainFrameOnly: false)
        config.userContentController.addUserScript(script)
        config.userContentController.add(self, name: "iosListener")

如何快速读取 wkwebview 消息的 console.log？在 UIwebview 我可以使用

 let context = self.webView.value(forKeyPath: "documentView.webView.mainFrame.javaScriptContext") as! JSContext

        let logFunction : @convention(block) (String) -> Void =
        {
            (msg: String) in

            NSLog("Console: %@", msg)
        }
       context.objectForKeyedSubscript("console").setObject(unsafeBitCast(logFunction, to: AnyObject.self), forKeyedSubscript: "log" as NSString)

但在 wkwebview 中它不起作用

【问题讨论】：

标签： ios swift

【解决方案1】：

如果我理解你想将文档的 console.log 重定向到你的应用日志。

我会建议这个解决方案：

这是使用WKUserScript 添加到您的webview 的脚本，就像您所做的那样。

    var console = (function (oldConsole) {
      return {
        ...oldConsole,
        log: function(msg) {
          window.webkit.messageHandlers.iosListener.postMessage(msg);
          oldConsole[level](msg);
        }
      }
    })(window.console);

然后您将在您指定的消息处理程序中收到所有console.log(msg) 中的msg。

如果您想跟踪的不仅仅是 console.log，您可以使用以下内容详细说明脚本：

extension WKWebView {

     func redirectConsole(messageHandlerName: String) {
        let script = """
        var console = (function (oldConsole) {
          function redirect(level) {
            return function(msg) {
              window.webkit.messageHandlers.\(messageHandlerName).postMessage({ method: "console", level: level, content: JSON.stringify(msg) })
              oldConsole[level](msg);
            };
          }
          return {
            ...oldConsole,
            log: redirect("log"),
            info: redirect("info"),
            warn: redirect("warn"),
            error: redirect("error"),
          }
        })(window.console);
        """
        evaluateJavaScript(script) { _, error in
            if let error = error {
                log(error.localizedDescription)
            }
        }
    }
}

...我在 messageHandler 中处理来自 webview 的日志。

【讨论】：

你有这个实现的示例