如何在 Android 应用程序的 WebView 中查看 Javascript 错误？

Posted 2023-04-18

【中文标题】如何在 Android 应用程序的 WebView 中查看 Javascript 错误？

【英文标题】：How can I see Javascript errors in WebView in an Android app?

【发布时间】：2013-01-29 09:04:15

【问题描述】：

我正在尝试在应用程序的 WebView 中运行 javascript。我正在 Nexus 7 上开发。

html / javascript 在 Chromium 上运行良好，但平板电脑上没有执行某些操作。有没有办法查看平板电脑上是否有任何 javascript 本身失败？一种控制台视图？

【参考方案1】：

您实际上可以从 WebView 接收控制台消息，这将允许您捕获它引发的错误。

这样做：

在您的 WebView 上启用 JavaScript 设置WebChromeClient 覆盖onConsoleMessage

例子：

    final WebView webView = (WebView) findViewById(R.id.webview_terms_conditions);

    WebSettings webSettings = webView.getSettings();
    webSettings.setJavaScriptEnabled(true);

    webView.setWebChromeClient(new WebChromeClient() 
        @Override
        public boolean onConsoleMessage(ConsoleMessage consoleMessage) 
            Log.d("MyApplication", consoleMessage.message() + " -- From line "
                    + consoleMessage.lineNumber() + " of "
                    + consoleMessage.sourceId());
            return super.onConsoleMessage(consoleMessage);
        
    );

    webView.loadUrl(getString(R.string.url_terms_conditions));

类似于它所说的 here，尽管该文档不完整并且使用了已弃用的方法。

---

在android KitKat上运行时，也可以enable remote debugging!

【讨论】：

日志可以在 android studio 2.2 的什么地方查看？

提醒：我几乎没有注意到 WebChromeClient() 和 WebViewClient 的区别。所以如果你没有看到onConsoleMessage 那是因为你找错了客户 ;-)

似乎在最近的 Chromium 版本中，onConsoleMessage 只有在应用程序可调试时才会被调用。另请参阅：bugs.chromium.org/p/chromium/issues/detail?id=905251 Chromium 也不会输出到 Logcat。

@user1788736 在最新版本的 Android Studio 中，如果您点击窗口底部的运行 (screenshot)，您将看到来自您应用的所有日志。不幸的是，应用程序会输出很多不感兴趣的日志，因此您真正感兴趣的日志将隐藏在您可能不感兴趣的日志中。由于大多数 Javascript 错误以“未捕获”开头，您可以通过搜索“未捕获”来解决此问题（您可以通过单击日志并按 CTRL+F 在日志中进行搜索）。

【参考方案2】：

你可以使用Remote Debugging WebViews

Chrome Devtools Remote Debugging

More info

使用 Chrome 开发者工具在您的原生 Android 应用程序中调试 WebView。

在 Android 4.4 (KitKat) 或更高版本上，使用 DevTools 调试原生 Android 应用程序中的 WebView 内容。

if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) 
    WebView.setWebContentsDebuggingEnabled(true);

在电脑浏览器中输入 chrome://inspect

【讨论】：

哇，令人印象深刻且有用！

这意味着，所有 webview.loadData() 调用本质上都是重定向到您的应用程序并移至浏览器。我说的对吗？

谢谢你们...非常有用，节省我的时间

【参考方案3】：

您也许可以使用Firebug lite。它只是一个书签，因此您可以在任何页面上打开它。

另外，请搜索还有很多其他类似的问题：

Is there a way to enable the JavaScript Error/Debug Console for Safari within Android? Debugging javascript on Android tablets/phones?

【讨论】：

如何将 firebug lite 注入 webview 中的远程 url？

【参考方案4】：

在 Android Studio "Arctic Fox" 中，只需查看 logcat。带有“cromium”标签的消息。