首页 > 解决方案 > 如何在 UWP 中的 WebView 中捕获页面的 JavaScript 错误和警告

问题描述

我想从我在UWP 应用程序内的WebView中托管的页面中捕获并记录任何 JavaScript 错误或警告。

我希望能够为我在应用程序的 WebView 中加载的任何网页捕获这些错误。

我知道 Visual Studio 具有附加到 UWP 应用程序的 WebView 并记录 JavaScript 错误的机制,但我想在没有 Visual Studio 的情况下做同样的事情。

JavaScript 错误处理的这个答案显示了如何在纯 JavaScript 中执行此操作,但我需要知道如何以及何时将这样的代码注入 WebView,或者是否有更好的方法来执行此操作。

如果可能的话,我希望在 F12 工具中拥有类似于 JavaScript 控制台的东西,但我至少需要能够获取 JavaScript 错误和警告。

标签: javascriptc#webviewuwp

解决方案


JavaScript 错误处理的这个答案显示了如何在纯 JavaScript 中执行此操作,但我需要知道如何以及何时将这样的代码注入 WebView,或者是否有更好的方法来执行此操作。

您可以尝试使用带有 JavaScript函数的InvokeScriptAsynceval在导航完成时将内容注入网页。

然后,如果您想在应用程序中获取错误消息,可以使用 window.external.notify字符串参数将信息发送回您的应用程序。要接收这些消息,请处理ScriptNotify事件。

我做了一个简单的代码示例供您参考:

<!DOCTYPE html>
<!--this is my local web page HTMLPage1.html-->
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title></title>
<script type="text/javascript">
    function test() {

    }
</script>
</head>
<body>

<input  value="click" onclick="test1()" type="button"/>
</body>
</html>
<WebView x:Name="webview" NavigationCompleted="webview_NavigationCompleted" ScriptNotify="webview_ScriptNotify" Source="ms-appx-web:///HTMLPage1.html"></WebView>
private void webview_ScriptNotify(object sender, NotifyEventArgs e)
{
    string msg = e.Value;
}

private async void webview_NavigationCompleted(WebView sender, WebViewNavigationCompletedEventArgs args)
{
    string functionString = "window.onerror = function(error, url, line) {window.external.notify( 'ERR:'+error+' url'+url+' Line: '+line);};";
    var ret = await webview.InvokeScriptAsync("eval", new string[] { functionString });
}

推荐阅读