【WebView2】（四）Web 与 WinForm 相互调用函数方法

小渣渣

需求：之前的文章写了如何实现 Web 界面与 WinForm 应用程序互相通信发送消息，但是只是发送消息成功，无法获取响应的信息，如果需要做到请求响应的那种形式，可能需要进一步封装和写大量的逻辑。如果实现 C# 客户端调用 Web 的某个函数方法获取返回结果呢？还有 Web 如何调用 C# 的代码并获取返回值呢？

回顾：

【WebView2】（一）初识 Microsoft Edge WebView2 技术
https://www.itsvse.com/thread-10361-1-1.html

【WebView2】（二）WinForm 引入 WebView2 显示 Web 内容
https://www.itsvse.com/thread-10362-1-1.html

【WebView2】（三）Web 与 WinForm 应用程序双向通信
https://www.itsvse.com/thread-10364-1-1.html

首先，先看实现的效果图，Web 网站调用 WinForm 应用程序获取剪切板数据，WinForm 应用程序调用 Web 的 abc 方法获取返回值，如下：



C# 调用 Web 函数方法

此方案演示如何在 Web 端运行 JavaScript。 在此方法中，主机应用指定要运行的 JavaScript 代码，并将代码传递 ExecuteScriptAsync到 Web。 该 ExecuteScriptAsync 函数将 JavaScript 结果返回给 ExecuteScript 调用方。

Angular index.html 页面代码如下：

登录可见。

前端主要是定义了一个 abc 函数。

winform 点击按钮调用 web 的 abc 函数，代码如下：

登录可见。

Web 页面调用 C# 函数方法

将本机对象传递到 Web。 然后从 Web 调用对象的方法。

若要使用表示方法调用的消息，请使用 AddHostObjectToScript API。 在高级别上，此 API 允许将本机 (主机) 对象公开到 Web 端并充当代理。 使用 window.chrome.webview.hostObjects.{name}>a0>访问这些对象。参考文档：https://learn.microsoft.com/zh-cn/dotnet/api/microsoft.web.webview2.core.corewebview2.addhostobjecttoscript?view=webview2-dotnet-1.0.1343.22

在 web 页面新建一个按钮，点击按钮调用 c# 代码获取系统当前剪切板的数据。

Angular app.component.html 代码如下：

登录可见。

app.component.ts 代码如下：

登录可见。

前端 js 代码有同步调用和异步调用。

c# 定义一个 WebView2HostObject 主机对象，代码如下：

登录可见。

注意：自定义的 WebView2HostObject 类，必须标记 [ClassInterface(ClassInterfaceType.AutoDual)]、[ComVisible(true)] 特性，否则JS无法访问到该类。

然后通过 AddHostObjectToScript(String，Object) 添加新定义的实例，代码如下：

登录可见。

最后，前端点击按钮即可获取到剪切板数据，效果图如下：



（完）

飞鱼

学习一下

落月天涯

学习一下，感谢分享