带有JavaScript文件的HTML在WPF应用程序内的WebView2上不起作用
在我的带有JavaScript文件的HTML在WPF应用程序内的WebView2上不起作用,javascript,c#,jquery,wpf,webview2,Javascript,C#,Jquery,Wpf,Webview2,在我的WPF项目中，我使用的控件可以按预期正确显示常规html文件和/或html字符串。但是，如果html字符串包含一个源代码为JavaScript文件的脚本标记，则链接的JavaScript文件中的代码将不起作用。但是，如果我将生成的完全相同的HTML字符串复制到驱动器上的本地文件并将其另存为HTML文件，则相同的HTML和链接的JavaScript可以正常工作： 备注：代码中的JQueryTest.js文件来自第二个链接，标题为从下载未压缩的开发jQuery 3.6.0。由于文件很大，为了简
WPFJavaScriptJQueryTest.js从下载未压缩的开发jQuery 3.6.0JavaScript<Window x:Class="WpfJunkWebView2.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:WpfJunkWebView2"
xmlns:wv2="clr-namespace:Microsoft.Web.WebView2.Wpf;assembly=Microsoft.Web.WebView2.Wpf"
mc:Ignorable="d"
Title="MainWindow" Height="450" Width="800">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Button x:Name="btnTest" Content="Test" Click="btnTest_Click" HorizontalAlignment="Left"/>
<wv2:WebView2 x:Name="wvTest" Grid.Row="1"/>
</Grid>
</Window>
private async void btnTest_Click(object sender, RoutedEventArgs e)
{
string sFilePath = System.IO.Path.Combine(Environment.CurrentDirectory, @"JQueryTest.js");
Uri uri = new Uri(sFilePath);
string uriPath = uri.AbsoluteUri;
string sHtml = "<!DOCTYPE html>" +
"<html>" +
"<head>" +
"<script src=\"" + uriPath + "\"></script>" +
"<script>" +
"$(document).ready(function(){" +
"$(\"p\").click(function(){" +
"$(this).hide();" +
"});" +
"});" +
"</script>" +
"</head>" +
"<body>" +
"<p> If you click on this line, it will disappear.</p>" +
"<p> Click this text away!</p>" +
"<p> Click text too!</p>" +
"</body>" +
"</html>";
System.Diagnostics.Debug.Write(sHtml); //you can copy this HTML into an HTML file to test that it works.
await wvTest.EnsureCoreWebView2Async();
wvTest.NavigateToString(sHtml); //this line successfully displays HTML inside WebView2 but the JavaScipt code does not work
}
<!DOCTYPE html>
<!-- saved from url=(0011)about:blank -->
<html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><script src="file:///C:/tmp/WpfJunkWebView2/bin/Debug/netcoreapp3.1/JQueryTest.js"></script><script>$(document).ready(function(){$("p").click(function(){$(this).hide();});});</script></head><body><p> If you click on this line, it will disappear.</p><p> Click this text away!</p><p> Click text too!</p></body></html>
<Window x:Class="WpfJunkWebView2.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:WpfJunkWebView2"
xmlns:wv2="clr-namespace:Microsoft.Web.WebView2.Wpf;assembly=Microsoft.Web.WebView2.Wpf"
mc:Ignorable="d"
Title="MainWindow" Height="450" Width="800">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Button x:Name="btnTest" Content="Test" Click="btnTest_Click" HorizontalAlignment="Left"/>
<wv2:WebView2 x:Name="wvTest" Grid.Row="1"/>
</Grid>
</Window>
private async void btnTest_Click(object sender, RoutedEventArgs e)
{
string sFilePath = System.IO.Path.Combine(Environment.CurrentDirectory, @"JQueryTest.js");
Uri uri = new Uri(sFilePath);
string uriPath = uri.AbsoluteUri;
string sHtml = "<!DOCTYPE html>" +
"<html>" +
"<head>" +
"<script src=\"" + uriPath + "\"></script>" +
"<script>" +
"$(document).ready(function(){" +
"$(\"p\").click(function(){" +
"$(this).hide();" +
"});" +
"});" +
"</script>" +
"</head>" +
"<body>" +
"<p> If you click on this line, it will disappear.</p>" +
"<p> Click this text away!</p>" +
"<p> Click text too!</p>" +
"</body>" +
"</html>";
System.Diagnostics.Debug.Write(sHtml); //you can copy this HTML into an HTML file to test that it works.
await wvTest.EnsureCoreWebView2Async();
wvTest.NavigateToString(sHtml); //this line successfully displays HTML inside WebView2 but the JavaScipt code does not work
}
<!DOCTYPE html>
<!-- saved from url=(0011)about:blank -->
<html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><script src="file:///C:/tmp/WpfJunkWebView2/bin/Debug/netcoreapp3.1/JQueryTest.js"></script><script>$(document).ready(function(){$("p").click(function(){$(this).hide();});});</script></head><body><p> If you click on this line, it will disappear.</p><p> Click this text away!</p><p> Click text too!</p></body></html>
主窗口中的三行中的任意一行时，该行应消失，但不会发生。但是，如果生成的html以.html
的形式手动保存到文件中，然后在浏览器中手动打开（我在MS Edge和Google Chrome上对其进行了测试），则此功能可以正常工作
尝试失败的WebView2方案时，是否可以打开DevTools并检查控制台？我猜问题在于不允许NavigateToString内容访问文件URI。如果是这样，您可以将HTML写入文件并导航到文件URI而不是使用NavigateToString，或者您可以尝试使用通过HTTP URI而不是文件URI托管JavaScript文件。David，我尝试了您关于使用DevTools的建议，并注意到，即使在进入dailing WebView2场景之前，我也会遇到以下错误（加载html字符串时）：不允许加载本地资源：file:///C:/tmp/WpfJunkWebView2/bin/Debug/netcoreapp3.1/JQueryTest.js
。所以，问题似乎是文件URI。我注意到如果src
是外部URI（而不是文件URI）它是有效的。我将测试您的建议以找到解决方法。我尝试了将HTML写入文件的替代方法……但这只在第一次单击时起作用。例如，如果在上面的示例中，当单击“测试”按钮时，主页将显示上面我文章的图像中显示的三行内容。并且当y你点击那一行。但是当你再次点击测试按钮时，这些行不会再次出现（如果你不使用.NET应用程序手动浏览HTML，就会出现这种情况）.至于CoreWebView2.SetVirtualHostNameToFolderMapping
方法，我不知道如何在本地使用它-例如，在本例中，Windows 10上的主机名是什么：public void SetVirtualHostNameToFolderMapping（字符串主机名，字符串文件夹路径，Microsoft.Web.WebView2.Core.CoreWebView2HostResourceAccessKind accessKind）；
webView.CoreWebView2.SetVirtualHostNameToFolderMapping（“appassets.example”，“assets”，CoreWebView2HostResourceAccessKind.DenyCors）；webView.Source=新Uri（“https://appassets.example/index.html")；
folderPath可以是绝对路径C:\…\appfolder，也可以是相对于应用程序文件夹的路径，就像使用上面名为“assets”的应用程序子文件夹一样。上面的路径将导航到应用程序文件夹的assets子文件夹中的index.html。主机名是要选择的任何主机名，以便映射到本地计算机上的文件夹