windows mfc webview2 接收html信息

webview2导入到mfc参考:

windows vs2022 MFC使用webview2嵌入网页-CSDN博客

webview2与js交互参考:WebView2教程(基于C++)【四】JS与C++互访(上)_window.chrome.webview.postmessage-CSDN博客

一、JS端发送和接收

JS中,通过postMessage方法向C++发送消息,代码如下

window.chrome.webview.postMessage(window.document.URL)

JS监听从C++发来的数据,代码如下:

window.chrome.webview.addEventListener("message", (e) => {
	//console.log(e);
	alert(e.data);
})

完整html:

<!DOCTYPE html>
<html>
	<head>
	</head>
	
	<body>
		<button onclick="test()">测试</button>
		<script>
			function test(){
				window.chrome.webview.postMessage('123')	
			}
			window.chrome.webview.addEventListener("message", (e) => {
				//console.log(e);
				alert(e.data);
			})
		</script>
	</body>
</html>

二、C++端webview2 接收消息和发送消息

C++中要想接收消息,必须注册一个WebMessageReceived事件,

在WebView2控件成功添加到窗口上时,我们就可以注册事件了,代码如下:

webview->add_WebMessageReceived(Callback<ICoreWebView2WebMessageReceivedEventHandler>(
				[](ICoreWebView2* webview, ICoreWebView2WebMessageReceivedEventArgs* args) -> HRESULT {
					wil::unique_cotaskmem_string message;
					args->TryGetWebMessageAsString(&message);//从html接收数据
					// processMessage(&message);
					webview->PostWebMessageAsString(message.get());//发送数据到html
					return S_OK;
				}).Get(), &token);

三、从本地加载一个html

本地文件路径:file:///C:/Users/76211/Desktop/a.html

完整代码:

void CMFCApplication1Dlg::LoadUrl(const wstring& strUrl)
{
	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 WebView
	CreateCoreWebView2EnvironmentWithOptions(nullptr, nullptr, nullptr,
		Callback<ICoreWebView2CreateCoreWebView2EnvironmentCompletedHandler>(
			[hWnd, strUrl](HRESULT result, ICoreWebView2Environment* env) -> HRESULT {

				// Create a CoreWebView2Controller and get the associated CoreWebView2 whose parent is the main window hWnd
				env->CreateCoreWebView2Controller(hWnd, Callback<ICoreWebView2CreateCoreWebView2ControllerCompletedHandler>(
					[hWnd, strUrl](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 settings
						wil::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 window
						RECT bounds;
						::GetClientRect(hWnd, &bounds);
						webviewController->put_Bounds(bounds);

						// Schedule an async task to navigate to Bing
						webview->Navigate(strUrl.c_str());

						// <NavigationEvents>
						// Step 4 - Navigation events
						// register an ICoreWebView2NavigationStartingEventHandler to cancel any non-https navigation
						EventRegistrationToken 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 object
						webview->AddScriptToExecuteOnDocumentCreated(L"Object.freeze(Object);", nullptr);
						// Schedule an async task to get the document URL
						webview->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 content
						webview->add_WebMessageReceived(Callback<ICoreWebView2WebMessageReceivedEventHandler>(
							[](ICoreWebView2* webview, ICoreWebView2WebMessageReceivedEventArgs* args) -> HRESULT {
								wil::unique_cotaskmem_string message;
								args->TryGetWebMessageAsString(&message);//从html接收数据
								// processMessage(&message);
								webview->PostWebMessageAsString(message.get());//发送数据到html
								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 host
						webview->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());
}

四、运行截图

打开界面,本地网页在mfc界面中:

从html接收到的数据:

发送到html的数据:

五、微软官方参考

WebView2 功能和 API 概述 - Microsoft Edge Developer documentation | Microsoft Learn

说明:

webview->AddScriptToExecuteOnDocumentCreated(
							L"window.chrome.webview.addEventListener(\'message\', event => alert(event.data));" \
							L"window.chrome.webview.postMessage(window.document.URL);",
							nullptr);

这段代码在切换网页时会弹框,可以不需要

相关推荐
十年一梦实验室18 分钟前
【C++】sophus : sim_details.hpp 实现了矩阵函数 W、其导数,以及其逆 (十七)
开发语言·c++·线性代数·矩阵
taoyong00121 分钟前
代码随想录算法训练营第十一天-239.滑动窗口最大值
c++·算法
这是我5828 分钟前
C++打小怪游戏
c++·其他·游戏·visual studio·小怪·大型·怪物
fpcc35 分钟前
跟我学c++中级篇——C++中的缓存利用
c++·缓存
呆萌很1 小时前
C++ 集合 list 使用
c++
诚丞成2 小时前
计算世界之安生:C++继承的文水和智慧(上)
开发语言·c++
乔峰不是张无忌3302 小时前
【HTML】动态闪烁圣诞树+雪花+音效
前端·javascript·html·圣诞树
东风吹柳3 小时前
观察者模式(sigslot in C++)
c++·观察者模式·信号槽·sigslot
A懿轩A3 小时前
C/C++ 数据结构与算法【栈和队列】 栈+队列详细解析【日常学习,考研必备】带图+详细代码
c语言·数据结构·c++·学习·考研·算法·栈和队列
大胆飞猪4 小时前
C++9--前置++和后置++重载,const,日期类的实现(对前几篇知识点的应用)
c++