使用新的 WebView2 控件并通过 window.external 调用访问旧服务器......有什么方法可以捕获这些？

Question

我正在开发以前使用 WebBrowser 控件并通过使用 window.external 调用（例如 window.external.myMethod()）与 cshtml 网页来回通信的 Office 插件。

我们已切换到使用上个月在 GA 发布的新 WebView2 控件，并更新了我们当前的 cshtml 页面以使用该控件的正确调用（例如 chrome.webview.hostObjects.myObject.myMethod()） .

我请求帮助的问题是，我的插件还可以连接到仍在运行这些 cshtml 页面的旧服务器，这些页面包含旧的 window.external 调用。我正在尝试找出一种仍然来回传递值的方法。

我知道每次使用 WebView2 控件加载页面时都可以注入一些 javascript，例如：

    await webBrowser.CoreWebView2.AddScriptToExecuteOnDocumentCreatedAsync("my javascript");

...我们实际上这样做是为了挂钩几个事件。我们也可以运行 WebView2 的 ExecuteScriptAsync。

我不确定这两种方法是否可行，或者是否有更好的方法我没有想到。如果我要注入一些 Javascript 来运行，它甚至会是什么样子！

希望大家给点建议...

Answer 1

是的，您可以使用通过AddScriptToExecuteOnDocumentCreatedAsync 注入的脚本将WebView2 的主机对象连接到window.external。例如，在我们的sample app 中，我打开了 Scenarios|Host Objects 菜单项，打开了 DevTools 窗口并运行了以下代码：

window.external = await window.chrome.webview.hostObjects.sync;
window.external.sample.property; // "Example Property String Value"

但是有一些潜在的陷阱需要注意：

1. 主要的潜在缺陷是 WebView2 主机对象支持与 mshtml 的 window.external 功能不完全兼容。最明显的是，默认情况下 WebView2 对其主机对象使用异步代理。您可以使用异步主机对象代理上的 sync 属性选择加入同步代理，该属性返回同步代理的承诺。但也可能存在其他不兼容之处。不是简单地将同步代理分配给window.external，另一种方法是创建您自己的一组JavaScript 函数，这些函数环绕window.chrome.webview.hostObjects 属性，以解决您发现的任何此类问题并将该包装器分配给@987654330 @。
2. window.chrome.webview.hostObjects 属性延迟其初始化，直到它被实际引用。如果可以，您可能希望延迟引用它，或者仅在您知道需要它的页面上将其分配给 window.external。
3. 目前有a bug with AddScriptToExecuteOnDocumentCreatedAsync 的代码在子框架中不执行跨域。