用于部署 WebView2 运行时的 WiX 自定义操作

此示例 WV2DeploymentWiXCustomActionSample 演示如何使用 WiX 自定义操作部署 WebView2 运行时。

为了帮助你了解如何使用应用部署 Evergreen WebView2 Runtime,此示例为 WebView2APISample 创建一个 WiX 安装程序,并使用 WiX 自定义操作来链式安装 Evergreen WebView2 运行时。

此示例演示了几种不同的部署方法:

  • 使用链接下载 Evergreen WebView2 运行时引导程序。
  • 将 Evergreen WebView2 运行时引导程序打包到应用。
  • 使用应用打包 Evergreen WebView2 运行时独立安装程序。

步骤 1 - 安装具有C++支持的 Visual Studio 2019

Microsoft Visual Studio 是必需的。 此示例不支持Microsoft Visual Studio Code。

  1. Visual Studio - 如果尚未安装具有C++支持的 Visual Studio 2019 (最低要求版本) ,请参阅在为 WebView2 设置开发环境安装 Visual Studio。 按照该部分中的步骤安装具有C++支持的 Visual Studio 2019,然后返回到此页面并继续执行以下步骤。

步骤 2 - 安装 WiX 工具集生成工具

如果尚未安装,请安装 WiX 工具集:

  1. 在新窗口或选项卡中,转到 “WiX 工具集” ,然后下载 “WiX 工具集”生成工具

  2. 单击该文件 wixnnn.exe ,然后单击“ 打开文件”。

    可能会打开一个对话框,需要启用 .NET Framework 3.5.1

    需要.NET Framework对话框

    如果计算机上已启用 .NET Framework 3.5.1,请跳到继续安装此 WiX 组件。

  3. 单击“ 确定” 按钮。 WiX 安装程序窗口将关闭。

  4. Windows 徽标键Windows 徽标键,键入 Windows 功能,然后按 Enter。 此时会显示 “打开或关闭 Windows 功能 ”对话框。

  5. 选中“.NET Framework 3.5 (包含 .NET 2.0 和 3.0) 检查框:

    打开或关闭 > Windows 功能.NET Framework 3.5

    无需选择子项。

  6. 单击“确定”。 系统可能会提示是否允许Windows 更新下载文件。

    有关详细信息,请参阅在 Windows 11、Windows 10、Windows 8.1 和 Windows 8 上安装 .NET Framework 3.5

  7. 启用 .NET Framework 3.5.1 后,再次运行 wixnnn.exe 该文件。 例如,在 Microsoft Edge 中,依次单击“设置”和“更多、“下载”,然后单击下面的wix311.exe打开文件”。

  8. 单击 WiX 安装程序的 “安装 ”面板。

  9. “用户帐户控制”中,单击“ ”按钮。 WiX 安装程序的顶部显示“已成功安装”。

另请根据下一部分安装 WiX Visual Studio 组件。

步骤 3 - 安装 WiX 工具集 Visual Studio 扩展

如果尚未安装,请安装 WiX 工具集 Visual Studio 2019 扩展:

  1. 在新窗口或选项卡中,转到 “WiX 工具集” ,然后下载并安装扩展:

    • WiX 工具集 Visual Studio 2019 扩展 - 下载的安装程序文件: Votive2019.vsix
  2. “用户帐户控制”中,单击“ ”按钮。 将打开适用于 WiX Visual Studio 扩展的 VSIX 安装程序:

    适用于 WiX Visual Studio 2019 扩展的 VSIX 安装程序

  3. 单击“ 安装 ”按钮。

  4. 如果 正在等待进程关闭的 VSIX 对话框打开,请关闭 Visual Studio。 VSIX 安装程序将继续。

    VSIX 安装程序读取 “安装完成”:

    VSIX 安装程序 - 安装完成 - WiX 工具集 Visual Studio 2019 扩展

  5. 在 VSIX 安装程序中,单击“ 关闭 ”按钮。

  6. 在 WiX 安装程序中,单击“ 退出 ”面板。

步骤 4 - 克隆 WebView2Samples 存储库

  1. 如果尚未执行此操作,请将 WebView2Samples 存储库克隆到本地驱动器。 在单独的窗口或选项卡中,请参阅为 WebView2设置开发环境中的克隆 WebView2 示例存储库。 按照该部分中的步骤操作,然后返回到此页面,然后继续以下操作。

步骤 5 - 在 Visual Studio 中打开解决方案

  1. 在 WebView2Samples 存储库的本地副本中,使用 Visual Studio 打开 <repo-location>\WebView2Samples\SampleApps\WebView2Samples.sln (不Visual Studio Code) 。

步骤 6 - 编辑 Product.wxs 以配置如何分发 WebView2 运行时

  1. 在项目下WV2DeploymentWiXCustomActionSample打开Product.wxs

  2. 根据要使用的方法进行编辑 Product.wxs

如果希望应用通过链接下载 Evergreen WebView2 运行时引导程序 (MicrosoftEdgeWebview2Setup.exe) :

  1. 在 下 <!-- Step 4: Config Custom Action to download/install Bootstrapper -->,取消注释 <CustomAction Id='DownloadAndInvokeBootstrapper' ...> 下面的 <!-- [Download Bootstrapper] ... -->元素。

  2. 注释掉 下Step 4的其他 <Binary><CustomAction> 元素。

  3. 在 下 <!-- Step 5: Config execute sequence of custom action -->,取消注释 <Custom Action='DownloadAndInvokeBootstrapper' ...> 下面的 <!-- [Download Bootstrapper] ...-->元素。

  4. 注释掉 下Step 5的其他<Custom>元素。

方法 2:使用应用打包 Evergreen WebView2 运行时引导程序

如果要将 Evergreen WebView2 Runtime Bootstrapper (MicrosoftEdgeWebview2Setup.exe) 与应用一起打包:

  1. 在 下<!-- Step 4: Config Custom Action to download/install Bootstrapper -->,取消注释 <Binary Id="MicrosoftEdgeWebview2Setup.exe" ...> 下面的 <!-- [Package Bootstrapper] ... --><CustomAction Id='InvokeBootstrapper' ...> 元素。

  2. 注释掉 下Step 4的其他 <Binary><CustomAction> 元素。

  3. 在 下 <!-- Step 5: Config execute sequence of custom action -->,取消注释 <Custom Action='InvokeBootstrapper' ...> 下面的 <!-- [Package Bootstrapper] ...-->元素。

  4. 注释掉 下Step 5的其他<Custom>元素。

方法 3:使用应用打包 Evergreen WebView2 运行时独立安装程序

如果要将 Evergreen WebView2 运行时独立安装程序与应用一起打包:

  1. 在 下<!-- Step 4: Config Custom Action to download/install Bootstrapper -->,取消注释 <Binary Id="MicrosoftEdgeWebView2RuntimeInstallerX64.exe" ...> 下面的 <!-- [Package Standalone Installer] ... --><CustomAction Id='InvokeStandalone' ...> 元素。

  2. 注释掉 下Step 4的其他 <Binary><CustomAction> 元素。

  3. 如果面向非 X64 设备,可能还需要编辑 MicrosoftEdgeWebView2RuntimeInstallerX64 文件名以反映正确的体系结构。

  4. 在 下 <!-- Step 5: Config execute sequence of custom action -->,取消注释 <Custom Action='InvokeStandalone' ...> 下面的 <!-- [Package Standalone Installer] ...-->元素。

  5. 注释掉 下Step 5的其他<Custom>元素。

步骤 7 - 将引导程序或安装程序放入 文件夹中

如果计划将 Bootstrapper (方法 2) 或独立安装程序 (方法 3) 与应用打包:

  1. 下载引导程序或独立安装程序。 在 Microsoft Edge WebView2 中,单击“ 立即下载”,向下滚动到 “下载 WebView2 运行时 ”部分。

  2. 将下载的 Bootstrapper 或独立安装程序放在封闭 SampleApps 文件夹下。

步骤 8 - 生成安装程序项目

  1. WV2DeploymentVSInstallerSample生成项目。

另请参阅