WKWebView 出现 Javascript 错误

Question

有什么方法可以从 WebView 获取 JavaScript 错误吗？我的意思是以下错误和可能的警告？

我正在运行具有以下扩展名的 JS 代码：

extension WKWebView {
    func evaluateJavaScriptWithReturn(_ javaScriptString: String) -> String? {
        var finished = false
        var jsValue: String?
        
        evaluateJavaScript(javaScriptString) { (result, error) in
            if error == nil {
                if result != nil {
                    jsValue = result as? String
                }
            } else {
                jsValue = nil
            }
            finished = true
        }
        
        while !finished {
            RunLoop.current.run(mode: .defaultRunLoopMode, before: Date.distantFuture)
        }
        
        return jsValue
    }
}

但是

error

不是我要找的！ 有什么办法可以让我的应用程序出现上述错误吗？ 非常感谢！

Answer 1

为了处理错误，我们将在加载到页面中的 HTML 中添加一些 JavaScript，以通知我们的本机代码有关错误的信息。

首先，您需要使用脚本消息处理程序设置 Web 视图：

let controller = WKUserContentController()
controller.add(self, name: "error")

let configuration = WKWebViewConfiguration()
configuration.userContentController = controller

let webView = WKWebView(frame: .zero, configuration: configuration)

我在本地创建完整的 HTML 文档并注入以下 JavaScript：

window.onerror = (msg, url, line, column, error) => {
  const message = {
    message: msg,
    url: url,
    line: line,
    column: column,
    error: JSON.stringify(error)
  }

  if (window.webkit) {
    window.webkit.messageHandlers.error.postMessage(message);
  } else {
    console.log("Error:", message);
  }
};

（我有检查和日志，因为我有时在浏览器中运行生成的 JavaScript。）如果你想将它注入到你不能完全控制的 HTML 中，你也可以使用

WKUserContentController

添加

WKUserScript

。

接下来，当您将字符串加载到 Web 视图中时，请务必使用

localhost

作为基本 URL 。如果你不这样做，你所有的错误都将是

"Script error."

。

webView.loadHTMLString(html, baseURL: URL(string: "http://localhost/")!)

现在定义您的

WKScriptMessageHandler

：

func userContentController(_ userContentController: WKUserContentController, didReceive message: WKScriptMessage) {
    switch message.name {
    case "error":
        // You should actually handle the error :)
        let error = (message.body as? [String: Any])?["message"] as? String ?? "unknown"
        assertionFailure("JavaScript error: \(error)")
    default:
        assertionFailure("Received invalid message: \(message.name)")
    }
}

您可以将其他情况添加到 switch 语句中，以用于添加到

WKUserContentController

的其他消息。

Answer 2

尝试以下方法。

首先，注入JS代码来捕获html内容中的错误：

window.onerror = function(error) {
  alert(error); // Fire when errors occur. Just a test, not always do this.
};

第二，在WKWebView委托方法中显示错误：

func webView(_ webView: WKWebView, runJavaScriptAlertPanelWithMessage message: String, initiatedByFrame frame: WKFrameInfo, completionHandler: @escaping () -> Void) {
    let alertController = UIAlertController(title: "alert", message: message, preferredStyle: UIAlertControllerStyle.alert)
    alertController.addAction(UIAlertAction(title: "OK", style: UIAlertActionStyle.cancel, handler: nil))
    self.present(alertController, animated: true, completion: nil)

    print("An error from web view: \(message)")
}

记得设置委托：

webView.uiDelegate = self

如果你想避免警报，另一种方法是使用

decidePolicyForNavigationAction

方法来接收 JS 的回调，就像

window.open("error://message","_self")

Answer 3

在 JavaScript 中，挂钩窗口 onerror 事件以回调脚本消息处理程序：

window.onerror = function (msg, url, line) {
    window.webkit.messageHandlers.mylog.postMessage("JS: ERROR:" + msg + " @" + url + ":" + line);
};

您可能只会收到“脚本错误”。消息，这是一个权限问题。 （文档）根据您的设置，可以通过向您的首选项添加权限来修复此问题。 斯威夫特：

webView.configuration.preferences.setValue(true, forKey: "allowFileAccessFromFileURLs")

Answer 4

我发现的最佳解决方案是使用 Safari 的 Web Inspector。 这里有说明。

我不断遇到

Script error.

消息，使用 Yun CHEN 的解决方案（非常棒），但没有可操作的内容。