WebView2 控件未加载 HTML 字符串

Question

WebView2 Control: As shown below, the HTML String successfully loads via NavigateToString(...) 在 Button_Click(...) 事件中调用。但是我需要在 Window and/or 其 Grid 加载后立即加载 HTML 字符串。但是构造函数 MainWindow(){...} 或 rootGrid_Loadded(...) 事件中的以下代码会抛出如下所示的错误：

问题：我们如何解决问题并在 Window 或 Grid 之后立即加载 HTML string加载？还是有更好的solutions/workarounds?

MainWindow.xaml:

<Window x:Class="WpfWebView2TEST.MainWindow"
        .....
        xmlns:wv2="clr-namespace:Microsoft.Web.WebView2.Wpf;assembly=Microsoft.Web.WebView2.Wpf"
        mc:Ignorable="d"
        Style="{StaticResource CustomWindowStyle}"
        Title="MainWindow" Height="450" Width="800">
    
    <Grid>
        <Button x:Name="btnTest" Content=Test" Click="btnTest_Click"/>
        <wv2:WebView2 Name="MyWebView" />
    </Grid>
</Window>

注意：在以下构造函数或 rootGrid_Loaded(...) 事件中调用 MyLoadHTMLString() 会引发如下所示的错误：

MainWindow.xaml.cs:

public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
        MyLoadHTMLString();
    }
........
}

private void rootGrid_Loaded(object sender, RoutedEventArgs e)
{
  MyLoadHTMLString();
}


public void MyLoadHTMLString()
{
    string sHTML = "<!DOCTYPE html>" +
    "<html lang=\"en\" xmlns=\"http://www.w3.org/1999/xhtml\">" +
    "<head>" +
        "<meta charset=\"utf-8\" />" +
        "<title>Test Title</title>" +
    "</head>" +
    "<body>" +
        "<p>Test paragraph</p>" +
    "</body>" +
    "</html>";
MyWebView.NavigateToString(sHTML);
}

注意：跟随按钮点击事件successfully加载HTML字符串到WebView2

private void btnTest_Click(object sender, RoutedEventArgs e)
{
  MyLoadHTMLString();
}

错误:

System.InvalidOperationException HResult=0x80131509 Message=Attempted to use WebView2 functionality which requires its CoreWebView2 prior to the CoreWebView2 being initialized. Call EnsureCoreWebView2Async or set the Source property first. Source=Microsoft.Web.WebView2.Wpf

更新:

此 MSDN Doc 的第二段和第三段似乎为此类问题提供了一些解决方案。但我不确定如何实现它

Answer 1

第一个：

您问题的答案：

您必须确保 Webview2 控件是 initialized 才能使用它。您可以通过以下两种方式之一执行此操作，或者调用：

await MyWebView.EnsureCoreWebView2Async();

或者简单地设置 Source 属性.

下一个： 这只是一个很好的建议。我从不使用 'NavigateToString'，因为在 C# 字符串中使用 html 会很快变成 'messy'.

相反，我创建了一个子文件夹（名为 'html'）。然后我在这个文件夹中有一个 html 文件，一个 css 文件和一个 script 文件。现在我可以直接编辑文件并在设计时进行智能感知和错误检查。

记住：点击'Property Inspector'中的文件，然后在属性window、select'Copy to output directory'中.这里 select：'Copy if newer'。现在文件将被复制到 'Bin' 文件夹，因此 WebView2 可以找到它们。

现在在您的代码中，您只需将 WebView2 的 Source 属性设置为 html 文件的路径，如下所示：

MyWebView.Source = new Uri(Path.Combine(Environment.CurrentDirectory, @"Html\MyWebView.html"));

注意：这将自动初始化 WebView2 并导航到您的 html 文件。

在您的 html 文件中，您现在可以包括 css 和脚本文件，就像您通常对网页所做的那样：

<html>
<head>
    <meta charset="utf-8" />
    <title>Whatever</title>
    <link rel="stylesheet" href="MyWebView.css" type="text/css" />
    <script type="text/javascript" src="MyWebView.js">
    </script>
................

恕我直言，这是一种更好的本地使用方式 html - 更易于维护。

Answer 2

要将 html 加载到 WebView2，您可以使用 NavigateToString:

private async void Form1_Load(object sender, EventArgs e)
{
    var html = @"
        <html>
            <head>
                <title>Basic Web Page</title>
            </head>
            <body>
                Hello World!
            </body>
        </html>";

    await webView21.EnsureCoreWebView2Async();
    webView21.NavigateToString(html);
}

WebView2 控件未加载 HTML 字符串

WebView2 control not loading HTML string

c#

wpf

xaml

webview2