Webview2 / VB .NET - 无法加载网页

Question

Webview2 / VB .NET - 无法加载网页

Eri*_*c F 2 vb.net webview2

背景

我最近一直在尝试使用 WebView2 控件来代替 Visual Studio 中内置的 WebBrowser 控件。我已按照以下步骤进行安装：

安装独立安装程序
右键单击“解决方案资源管理器”>“管理 NuGet 包”>“浏览”>“WebView2”>“安装”

我构建了一个非常简单的程序，实际上只有 WebView2 控件，带有一个文本框和两个按钮：

所以据说当我点击“Go”按钮（按钮 1）时，它应该导航到https://www.google.com

问题

问题是它不加载网页。我已经尝试了该WebView21.Source = New Uri(TextBox1.Text)方法以及loadpage使用异步调用调用它的方法。每次加载的结果页面：

我还尝试过什么？

我刚刚完成了此处显示的步骤，这就是我进行初始化过程的原因。我已经用button2调用了初始化，但页面看起来仍然一样。

问题

我真的不知道还有什么可以尝试让它发挥作用？我搜索了一下，似乎大多数都没有这个问题。任何帮助是极大的赞赏！

Answer 1

use*_*821 5

下面显示了如何在 VB.NET 中创建使用WebView2控件的项目。我编写它的方式使其对具有不同经验水平的其他人也有用。

使用 WebView2 需要安装 MS Edge。MS Edge 所需的最低版本号取决于您选择使用的 WebView2 版本。有关更多信息，请参阅WebView2 发行说明。

确保已安装 MS Edge。如果没有，请下载/安装 MS Edge。

如果您已安装 MS Edge，要检查 MS Edge 版本号，请在 MS Edge 地址栏中键入以下内容：edge://settings/help

或者，

打开MS Edge
点击在右上角
选择帮助和反馈
选择关于 Microsoft Edge

WebView2 运行时可能已通过 Windows Update 安装在您的计算机上。

检查是否安装了 WebView2 运行时：

打开控制面板
选择查看方式：小图标
单击程序和功能

注意：WebView2 运行时名为：Microsoft Edge WebView2 Runtime。如果未安装 WebView2 运行时（或者您想使用特定版本），您可以下载 WebView2 运行时并安装它。

64 位操作系统：

WebView2 运行时：

%ProgramFiles(x86)%\Microsoft\EdgeWebView\Application\<version>

Run Code Online (Sandbox Code Playgroud)

注册表：

HKEY_LOCAL_MACHINE\SOFTWARE\WOW6432Node\Microsoft\EdgeUpdate\Clients\{F3017226-FE2A-4295-8BDF-00C3A9A7E4C5}

Run Code Online (Sandbox Code Playgroud)

32位操作系统：

WebView2 运行时：

%ProgramFiles%\Microsoft\EdgeWebView\Application\<version>

Run Code Online (Sandbox Code Playgroud)

以下说明是针对 VS 2019 编写的。

对比 2019 年：

打开视觉工作室
单击“无需代码继续”
单击文件
选择新建
选择项目
Visual Basic Windows 桌面
单击Windows 窗体应用程序 (.NET Framework)
点击下一步
指定项目名称（名称：WebView2Test）
单击创建

打开属性窗口

在 VS 菜单中，选择查看
选择属性窗口

打开解决方案资源管理器

在 VS 菜单中，选择查看
选择解决方案资源管理器

设置 NuGet 包管理器设置（推荐）

在VS菜单中，单击“工具”
选择选项...
展开NuGet 包管理器
单击常规
在“包管理”下，对于“默认包管理格式”，选择“PackageReference”
单击“确定”

添加WebView2 NuGet包

在解决方案资源管理器中，右键单击 <项目名称>
选择管理 NuGet 包...
单击浏览
在搜索框中，键入：Microsoft.Web.WebView2
选择所需版本（例如：1.0.1054.31），然后单击“安装”
如果出现提示“Visual Studio 将对此解决方案进行更改。单击“确定”继续进行下面列出的更改。”，单击“确定”

将Load事件处理程序添加到表单

在解决方案资源管理器中，双击 <表单名称> 打开设计器（例如：Form1）
在“属性”窗口中，选择您的表单（例如：Form1）
单击闪电
双击“加载”将事件处理程序添加到表单

将FormClosed事件处理程序添加到表单

在解决方案资源管理器中，双击 <表单名称> 打开设计器（例如：Form1）
在“属性”窗口中，选择您的表单（例如：Form1）
单击闪电
双击FormClosed将事件处理程序添加到表单

将 TableLayoutPanel 添加到表单

在解决方案资源管理器中，双击要添加WebView2控件的表单（例如：Form1）
在 VS 菜单中，单击“查看”
选择工具箱
在工具箱中，展开所有 Windows 窗体
将TableLayoutPanel拖到您的表单（例如：Form1）
在“属性”窗口中，选择刚刚添加的 TableLayoutPanel（例如：TableLayoutPanel1）
选择行。在右侧，单击
修改一下，得到以下内容：
在“显示”下拉列表中选择“列”并进行修改，以便您拥有以下内容：
单击“确定”
在“属性”窗口中，对于 TableLayoutPanel，将Dock属性设置为Fill

将 TableLayoutPanel 添加到 TableLayoutPanel 的第一行

从工具箱中，将TableLayoutPanel拖动到 TableLayoutPanel1 的第一行
在“属性”窗口中，选择刚刚添加的 TableLayoutPanel（例如：TableLayoutPanel2）
选择行。在右侧，单击
修改一下，得到以下内容：
在Show的下拉列表中，选择Columns并进行修改，以便获得以下内容：

将 TextBox 添加到 TableLayoutPanel2 的 URL

从工具箱中，将TextBox拖动到 TableLayoutPanel2 的第四列（最大的列）
在属性窗口中，对于TextBox1，将(Name)属性设置为所需值（例如：textBoxAddressBar）。将Anchor属性设置为Left、Right，并将Text属性设置为所需值（例如：https://www.microsoft.com）
单击闪电
双击KeyDown将事件处理程序添加到表单

添加按钮

从工具箱中，将Button拖动到 TableLayoutPanel2 的第二列
在“属性”窗口中，对于Button1，将Text属性设置为Back，将(Name)属性设置为所需值（例如： btnBack），并将Anchor属性设置为Left, Right。
单击闪电
双击Click将事件处理程序添加到表单
Forward对（第 3 列）、Go（第 4 列）和Refresh（第 5 列）重复上述过程

完成后，它应该如下所示：

将WebView2控件添加到Form

在 VS 菜单中，单击“查看”
选择工具箱
在工具箱中，展开WebView2 Windows 窗体控件
将WebView2拖到TableLayoutPanel 的第二行（例如：TableLayoutPanel1）
在“属性”窗口中，对于WebView21，将Dock属性设置为Fill

您的表单应如下所示：

添加CoreWebView2InitializationCompleted事件处理程序：

在“属性”窗口中，选择 WebView2 控件的实例（例如：WebView21）
单击闪电
双击CoreWebView2InitializationCompleted将事件处理程序添加到表单

添加NavigationCompleted事件处理程序：

在“属性”窗口中，选择 WebView2 控件的实例（例如：WebView21）
单击闪电
双击NavigationCompleted将事件处理程序添加到表单

添加WebMessageReceived事件处理程序：（可选）

在“属性”窗口中，选择 WebView2 控件的实例（例如：WebView21）
单击闪电
双击WebMessageReceived将事件处理程序添加到表单

修改代码：

在解决方案资源管理器中，右键单击<表单名称>（例如：Form1）
选择查看代码

表格1.vb

Imports Microsoft.Web.WebView2.Core
Imports Microsoft.Web.WebView2
Imports System.IO

Public Class Form1
    Private Sub Form1_Load(sender As Object, e As EventArgs) Handles MyBase.Load
        LogMsg("MS Edge Version: " + CoreWebView2Environment.GetAvailableBrowserVersionString())

        If Not String.IsNullOrEmpty(textBoxAddressBar.Text) Then
            'navigate to URL
            'WebView21.Source = New Uri(textBoxAddressBar.Text)
            WebsiteNavigate(textBoxAddressBar.Text)
        End If
    End Sub

    Private Sub Form1_FormClosed(sender As Object, e As FormClosedEventArgs) Handles MyBase.FormClosed
        'unsubscribe from CoreWebView2 event(s) (remove event handlers) 
        RemoveHandler WebView21.CoreWebView2.HistoryChanged, AddressOf CoreWebView2_HistoryChanged
    End Sub

    Private Sub LogMsg(msg As String, Optional addTimestamp As Boolean = True)
        'ToDo: add desired code

        If addTimestamp Then
            msg = String.Format("{0} - {1}", DateTime.Now.ToString("yyyy/MM/dd HH:mm:ss.fff"), msg)
        End If

        Debug.WriteLine(msg)
    End Sub

    Private Sub UpdateAddressBar()
        'if necessary, update address bar
        If textBoxAddressBar.Text <> WebView21.Source.ToString() Then
            textBoxAddressBar.Text = WebView21.Source.ToString()

            'move cursor to end of text
            textBoxAddressBar.SelectionStart = textBoxAddressBar.Text.Length
            textBoxAddressBar.SelectionLength = 0
        End If
    End Sub

    Private Sub WebsiteNavigate(ByVal dest As String)
        If WebView21 IsNot Nothing AndAlso Not String.IsNullOrWhiteSpace(dest) Then

            'URL must start with one of the specified strings
            'if Not, pre-pend with "https://"
            If Not dest = "about:blank" AndAlso
                   Not dest.StartsWith("edge://") AndAlso
                   Not dest.StartsWith("file://") AndAlso
                   Not dest.StartsWith("http://") AndAlso
                   Not dest.StartsWith("https://") AndAlso
                   Not System.Text.RegularExpressions.Regex.IsMatch(dest, "^([A-Z]|[a-z]):") Then

                'set value
                dest = "https://" & dest
            End If

            'option 1
            WebView21.Source = New Uri(dest, UriKind.Absolute)

            'option 2
            'WebView21.CoreWebView2.Navigate(dest)

            'update address bar
            UpdateAddressBar()
        End If
    End Sub

    Private Sub textBoxAddressBar_KeyDown(sender As Object, e As KeyEventArgs) Handles textBoxAddressBar.KeyDown
        If e.KeyCode = Keys.Enter Then
            WebsiteNavigate(textBoxAddressBar.Text)
        End If
    End Sub

    Private Sub btnBack_Click(sender As Object, e As EventArgs) Handles btnBack.Click
        If WebView21 IsNot Nothing AndAlso WebView21.CanGoBack Then
            WebView21.GoBack()
        End If
    End Sub

    Private Sub btnForward_Click(sender As Object, e As EventArgs) Handles btnForward.Click
        If WebView21 IsNot Nothing AndAlso WebView21.CanGoForward Then
            WebView21.GoForward()
        End If
    End Sub

    Private Sub btnGo_Click(sender As Object, e As EventArgs) Handles btnGo.Click
        WebsiteNavigate(textBoxAddressBar.Text)
    End Sub

    Private Sub btnRefresh_Click(sender As Object, e As EventArgs) Handles btnRefresh.Click
        If WebView21 IsNot Nothing Then
            WebView21.Refresh()
        End If
    End Sub

    Private Sub WebView21_CoreWebView2InitializationCompleted(sender As Object, e As Microsoft.Web.WebView2.Core.CoreWebView2InitializationCompletedEventArgs) Handles WebView21.CoreWebView2InitializationCompleted
        LogMsg("WebView21_CoreWebView2InitializationCompleted")
        LogMsg("UserDataFolder: " & WebView21.CoreWebView2.Environment.UserDataFolder.ToString())

        'subscribe to CoreWebView2 event(s) (add event handlers) 
        AddHandler WebView21.CoreWebView2.HistoryChanged, AddressOf CoreWebView2_HistoryChanged

    End Sub

    Private Sub CoreWebView2_HistoryChanged(sender As Object, e As Object)
        'LogMsg("CoreWebView2_HistoryChanged")
        btnBack.Enabled = WebView21.CoreWebView2.CanGoBack
        btnForward.Enabled = WebView21.CoreWebView2.CanGoForward

        'update address bar
        UpdateAddressBar()
    End Sub

    Private Sub WebView21_NavigationCompleted(sender As Object, e As Microsoft.Web.WebView2.Core.CoreWebView2NavigationCompletedEventArgs) Handles WebView21.NavigationCompleted
        LogMsg("WebView21_NavigationCompleted")
    End Sub

    Private Sub WebView21_WebMessageReceived(sender As Object, e As Microsoft.Web.WebView2.Core.CoreWebView2WebMessageReceivedEventArgs) Handles WebView21.WebMessageReceived
        LogMsg("WebView21_WebMessageReceived")
    End Sub
End Class

Run Code Online (Sandbox Code Playgroud)

WebView2 创建一个用户数据文件夹。如果未指定位置，根据文档：

当未指定 userDataFolder 时，WebView2 在默认位置创建用户数据文件夹，如下所示：

对于打包的 Windows 应用商店应用程序，默认用户文件夹是包文件夹中的 ApplicationData\LocalFolder 子文件夹。对于现有的桌面应用程序，默认的用户数据文件夹是应用程序的 exe 路径 + .WebView2。我们建议您指定一个用户数据文件夹，并在存储所有其他应用程序数据的同一文件夹中创建该文件夹，而不是使用默认值。

注意：写入%ProgramFiles%或%ProgramFiles(x86)%需要管理员访问权限 - 不建议在此位置存储数据。

如果希望以编程方式初始化CoreWebView2，则必须在设置SourceWebView2 控件的属性之前对其进行初始化。如果CoreWebView2未初始化，设置Source将使其初始化。一旦CoreWebView2初始化，尝试再次初始化将不会有任何效果。

有关详细信息，请参阅EnsureCoreWebView2Async 。

如果您想指定用户数据文件夹的位置，请添加以下函数：

Private Async Function InitializeCoreWebView2Async(Optional userDataFolder As String = "") As Task
    Dim options As CoreWebView2EnvironmentOptions = Nothing
    Dim cwv2Environment As CoreWebView2Environment = Nothing

    'it's recommended to create the userDataFolder in the same location
    'that your other application data is stored (ie: in a folder in %APPDATA%)
    'if not specified, we'll create a folder in %TEMP%
    If String.IsNullOrEmpty(userDataFolder) Then
        userDataFolder = Path.Combine(Path.GetTempPath(), System.Reflection.Assembly.GetExecutingAssembly().GetName().Name)
    End If

    'create WebView2 Environment using the installed or specified WebView2 Runtime version.
    'cwv2Environment = Await CoreWebView2Environment.CreateAsync("C:\Program Files (x86)\Microsoft\Edge Dev\Application\1.0.1054.31", userDataFolder, options)
    cwv2Environment = Await CoreWebView2Environment.CreateAsync(Nothing, userDataFolder, options)

    'initialize
    Await WebView21.EnsureCoreWebView2Async(cwv2Environment)
End Function

Run Code Online (Sandbox Code Playgroud)

然后将 , 的代码替换Form1_Load为以下内容：

注意await：在设置 Source 属性（即：导航到 URL）之前确保初始化完成非常重要。在下面的代码中，userDataFolder将在以下位置创建：C:\Temp\<应用程序名称>（例如：C:\Temp\WebView2Test）。

Private Async Sub Form1_Load(sender As Object, e As EventArgs) Handles MyBase.Load
    LogMsg("MS Edge Version: " + CoreWebView2Environment.GetAvailableBrowserVersionString())

    'initialize 
    'Await InitializeCoreWebView2Async()
    Await InitializeCoreWebView2Async(Path.Combine("C:\Temp", System.Reflection.Assembly.GetExecutingAssembly().GetName().Name))

    If Not String.IsNullOrEmpty(textBoxAddressBar.Text) Then
        'navigate to URL
        'WebView21.Source = New Uri(textBoxAddressBar.Text)
        WebsiteNavigate(textBoxAddressBar.Text)
    End If
End Sub

Run Code Online (Sandbox Code Playgroud)

要执行 JavaScript，请参阅ExecuteScriptAsync。

更新：

有关其他CoreWebView2初始化选项，请参阅这篇文章。

资源：

归档时间：	3 年，10 月前
查看次数：	10237 次
最近记录：	2 年，10 月前