windows vs2022 MFC使用webview2嵌入网页

2024-08-22 23:44

本文主要是介绍windows vs2022 MFC使用webview2嵌入网页,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

Microsoft Edge WebView2 控件允许在本机应用中嵌入 web 技术(HTML、CSS 以及 JavaScript)。 WebView2 控件使用 Microsoft Edge 作为绘制引擎,以在本机应用中显示 web 内容。

一、通过菜单“项目”-“管理NuGet程序包”,下载相关包

二、安装 Microsoft.Web.WebView2

       在“浏览”分页的左上角的搜索栏中,键入 Microsoft.Web.WebView2,选择对应的版本,然后点击按钮安装

三、安装Microsoft.Windows.ImplementationLibrary

在“浏览”分页的左上角的搜索栏中,键入 Microsoft.Windows.ImplementationLibrary,选择对应的版本,然后点击按钮安装

四、添加界面消息映射

在对话框界面右击,选择“类向导”

 添加WM_CREATE和WM_SIZE消息:

五、添加代码

在MFCApplication1Dlg.h头文件中添加:

#include <iostream>
#include <wrl.h>
#include <wil/com.h>
#include "WebView2.h"#include <string>
#include <vector>
using namespace std;
using namespace Microsoft::WRL;// Pointer to WebViewController
static wil::com_ptr<ICoreWebView2Controller> webviewController = nullptr;// Pointer to WebView window
static wil::com_ptr<ICoreWebView2> webview = nullptr;

 在构造函数中添加:

CoInitializeEx(NULL, COINIT_APARTMENTTHREADED);

在析构函数中添加:

CoUninitialize();

在OnSize函数中添加:

if (webviewController != nullptr) {RECT bounds;GetClientRect(&bounds);webviewController->put_Bounds(bounds);
};

在OnCreate函数中添加:

HWND hWnd = this->m_hWnd;// TODO:  在此添加您专用的创建代码// <-- WebView2 sample code starts here -->// Step 3 - Create a single WebView within the parent window// Locate the browser and set up the environment for WebViewCreateCoreWebView2EnvironmentWithOptions(nullptr, nullptr, nullptr,Callback<ICoreWebView2CreateCoreWebView2EnvironmentCompletedHandler>([hWnd](HRESULT result, ICoreWebView2Environment* env) -> HRESULT {// Create a CoreWebView2Controller and get the associated CoreWebView2 whose parent is the main window hWndenv->CreateCoreWebView2Controller(hWnd, Callback<ICoreWebView2CreateCoreWebView2ControllerCompletedHandler>([hWnd](HRESULT result, ICoreWebView2Controller* controller) -> HRESULT {if (controller != nullptr) {webviewController = controller;webviewController->get_CoreWebView2(&webview);}// Add a few settings for the webview// The demo step is redundant since the values are the default settingswil::com_ptr<ICoreWebView2Settings> settings;webview->get_Settings(&settings);settings->put_IsScriptEnabled(TRUE);settings->put_AreDefaultScriptDialogsEnabled(TRUE);settings->put_IsWebMessageEnabled(TRUE);// Resize WebView to fit the bounds of the parent windowRECT bounds;::GetClientRect(hWnd, &bounds);webviewController->put_Bounds(bounds);// Schedule an async task to navigate to Bingwebview->Navigate(L"https://www.bing.com/");// <NavigationEvents>// Step 4 - Navigation events// register an ICoreWebView2NavigationStartingEventHandler to cancel any non-https navigationEventRegistrationToken token;webview->add_NavigationStarting(Callback<ICoreWebView2NavigationStartingEventHandler>([](ICoreWebView2* webview, ICoreWebView2NavigationStartingEventArgs* args) -> HRESULT {wil::unique_cotaskmem_string uri;args->get_Uri(&uri);std::wstring source(uri.get());if (source.substr(0, 5) != L"https") {args->put_Cancel(true);}return S_OK;}).Get(), &token);// </NavigationEvents>// <Scripting>// Step 5 - Scripting// Schedule an async task to add initialization script that freezes the Object objectwebview->AddScriptToExecuteOnDocumentCreated(L"Object.freeze(Object);", nullptr);// Schedule an async task to get the document URLwebview->ExecuteScript(L"window.document.URL;", Callback<ICoreWebView2ExecuteScriptCompletedHandler>([](HRESULT errorCode, LPCWSTR resultObjectAsJson) -> HRESULT {LPCWSTR URL = resultObjectAsJson;//doSomethingWithURL(URL);return S_OK;}).Get());// </Scripting>// <CommunicationHostWeb>// Step 6 - Communication between host and web content// Set an event handler for the host to return received message back to the web contentwebview->add_WebMessageReceived(Callback<ICoreWebView2WebMessageReceivedEventHandler>([](ICoreWebView2* webview, ICoreWebView2WebMessageReceivedEventArgs* args) -> HRESULT {wil::unique_cotaskmem_string message;args->TryGetWebMessageAsString(&message);// processMessage(&message);webview->PostWebMessageAsString(message.get());return S_OK;}).Get(), &token);// Schedule an async task to add initialization script that// 1) Add an listener to print message from the host// 2) Post document URL to the hostwebview->AddScriptToExecuteOnDocumentCreated(L"window.chrome.webview.addEventListener(\'message\', event => alert(event.data));" \L"window.chrome.webview.postMessage(window.document.URL);",nullptr);// </CommunicationHostWeb>return S_OK;}).Get());return S_OK;}).Get());

六、截图

头文件:

构造函数和析构函数:

OnSize函数:

 

OnCreate函数:

运行截图:

 参考文档:https://blog.51cto.com/fish/6178983

这篇关于windows vs2022 MFC使用webview2嵌入网页的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/1097741

相关文章

HTML5 getUserMedia API网页录音实现指南示例小结

《HTML5getUserMediaAPI网页录音实现指南示例小结》本教程将指导你如何利用这一API,结合WebAudioAPI,实现网页录音功能,从获取音频流到处理和保存录音,整个过程将逐步... 目录1. html5 getUserMedia API简介1.1 API概念与历史1.2 功能与优势1.3

gitlab安装及邮箱配置和常用使用方式

《gitlab安装及邮箱配置和常用使用方式》:本文主要介绍gitlab安装及邮箱配置和常用使用方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录1.安装GitLab2.配置GitLab邮件服务3.GitLab的账号注册邮箱验证及其分组4.gitlab分支和标签的

SpringBoot3应用中集成和使用Spring Retry的实践记录

《SpringBoot3应用中集成和使用SpringRetry的实践记录》SpringRetry为SpringBoot3提供重试机制,支持注解和编程式两种方式,可配置重试策略与监听器,适用于临时性故... 目录1. 简介2. 环境准备3. 使用方式3.1 注解方式 基础使用自定义重试策略失败恢复机制注意事项

nginx启动命令和默认配置文件的使用

《nginx启动命令和默认配置文件的使用》:本文主要介绍nginx启动命令和默认配置文件的使用,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录常见命令nginx.conf配置文件location匹配规则图片服务器总结常见命令# 默认配置文件启动./nginx

在Windows上使用qemu安装ubuntu24.04服务器的详细指南

《在Windows上使用qemu安装ubuntu24.04服务器的详细指南》本文介绍了在Windows上使用QEMU安装Ubuntu24.04的全流程:安装QEMU、准备ISO镜像、创建虚拟磁盘、配置... 目录1. 安装QEMU环境2. 准备Ubuntu 24.04镜像3. 启动QEMU安装Ubuntu4

使用Python和OpenCV库实现实时颜色识别系统

《使用Python和OpenCV库实现实时颜色识别系统》:本文主要介绍使用Python和OpenCV库实现的实时颜色识别系统,这个系统能够通过摄像头捕捉视频流,并在视频中指定区域内识别主要颜色(红... 目录一、引言二、系统概述三、代码解析1. 导入库2. 颜色识别函数3. 主程序循环四、HSV色彩空间详解

Windows下C++使用SQLitede的操作过程

《Windows下C++使用SQLitede的操作过程》本文介绍了Windows下C++使用SQLite的安装配置、CppSQLite库封装优势、核心功能(如数据库连接、事务管理)、跨平台支持及性能优... 目录Windows下C++使用SQLite1、安装2、代码示例CppSQLite:C++轻松操作SQ

Python常用命令提示符使用方法详解

《Python常用命令提示符使用方法详解》在学习python的过程中,我们需要用到命令提示符(CMD)进行环境的配置,:本文主要介绍Python常用命令提示符使用方法的相关资料,文中通过代码介绍的... 目录一、python环境基础命令【Windows】1、检查Python是否安装2、 查看Python的安

Python并行处理实战之如何使用ProcessPoolExecutor加速计算

《Python并行处理实战之如何使用ProcessPoolExecutor加速计算》Python提供了多种并行处理的方式,其中concurrent.futures模块的ProcessPoolExecu... 目录简介完整代码示例代码解释1. 导入必要的模块2. 定义处理函数3. 主函数4. 生成数字列表5.

Python中help()和dir()函数的使用

《Python中help()和dir()函数的使用》我们经常需要查看某个对象(如模块、类、函数等)的属性和方法,Python提供了两个内置函数help()和dir(),它们可以帮助我们快速了解代... 目录1. 引言2. help() 函数2.1 作用2.2 使用方法2.3 示例(1) 查看内置函数的帮助(