1、主动
在 VSTO(Word 外接程序)中,你可以通过监听 Word 的选中事件,并主动把选中的内容传给 WebView2。WebView2 无法**主动访问** Word 的选中内容(它是独立运行的浏览器内核),所以需要在宿主控件(`UcWordAiTaskPane`)中**通过 C# 代码推送选中内容给 WebView2**。
### ✅ 实现思路如下:
---
### 🧩 第一步:监听 Word 的选中变化(SelectionChange)
在 `ThisAddIn.cs` 中注册事件:
```csharp
private void ThisAddIn_Startup(object sender, System.EventArgs e)
{
this.Application.WindowSelectionChange += Application_WindowSelectionChange;
}
```
---
### 🧩 第二步:处理选中变化,获取选中文本,并传给 Uc 控件
```csharp
private void Application_WindowSelectionChange(Word.Selection Sel)
{
string selectedText = Sel?.Text ?? "";
// 找到当前任务窗格中的控件(你可能要根据文档或窗口关联获取正确的控件)
foreach (CustomTaskPane pane in Globals.ThisAddIn.CustomTaskPanes)
{
if (pane.Control is UcWordAiTaskPane uc && pane.Visible)
{
uc.SendSelectedTextToWebView(selectedText);
}
}
}
```
---
### 🧩 第三步:`UcWordAiTaskPane` 中定义方法,将内容传给 WebView2
```csharp
public void SendSelectedTextToWebView(string text)
{
string js = $"window.dispatchEvent(new CustomEvent('wordSelectionChanged', {{ detail: {System.Text.Json.JsonSerializer.Serialize(text)} }}));";
webView21.ExecuteScriptAsync(js);
}
```
这样,WebView2 页面内就能监听 `wordSelectionChanged` 事件来处理:
---
### 🧩 第四步:WebView2 中 JavaScript 监听事件
```html
<script>
window.addEventListener("wordSelectionChanged", (e) => {
const text = e.detail;
console.log("选中的文本:", text);
// 你可以做进一步的处理,如显示、分析、发送到服务器等
});
</script>
```
---
### ✅ 整体流程总结:
1. Word 中选中内容 => 触发 `WindowSelectionChange`
2. C# 获取选中内容 => 调用 WebView2 的 JS(通过 `ExecuteScriptAsync`)
3. JS 中监听事件并处理内容
---
如你还想支持**点击按钮刷新当前选中内容**,也可以通过按钮触发:
```csharp
var text = Globals.ThisAddIn.Application.Selection.Text;
uc.SendSelectedTextToWebView(text);
```
2、被动
## ✅ 实现方案概览
1. WebView2 中的网页按钮点击后,用 `window.chrome.webview.postMessage()` 向宿主发送请求。
2. VSTO C# 端在 `WebMessageReceived` 事件中捕获消息,获取 Word 当前选中的文本。
3. 用 `ExecuteScriptAsync` 把选中的文本返回给 WebView2 页面。
---
## 🧩 步骤一:Web 页面代码(嵌入 WebView2)
```html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>AI 文档助手</title>
</head>
<body>
<button id="getSelectionBtn">获取 Word 选中内容</button>
<pre id="output"></pre>
<script>
// 点击按钮向 VSTO 发消息
document.getElementById('getSelectionBtn').addEventListener('click', () => {
window.chrome.webview.postMessage({ type: "getSelection" });
});
// 接收来自 VSTO 的响应
window.addEventListener("wordSelectionChanged", (e) => {
document.getElementById("output").textContent = e.detail;
});
</script>
</body>
</html>
```
---
## 🧩 步骤二:C# 中注册 WebView2 的消息监听事件
在 `UcWordAiTaskPane.cs` 中添加如下逻辑:
```csharp
public partial class UcWordAiTaskPane : UserControl
{
public UcWordAiTaskPane()
{
InitializeComponent();
webView21.CoreWebView2InitializationCompleted += WebView21_CoreWebView2InitializationCompleted;
}
private void WebView21_CoreWebView2InitializationCompleted(object sender, CoreWebView2InitializationCompletedEventArgs e)
{
if (webView21.CoreWebView2 != null)
{
webView21.CoreWebView2.WebMessageReceived += CoreWebView2_WebMessageReceived;
}
webView21.CoreWebView2.Navigate("your_local_or_embedded_page.html");
}
private void CoreWebView2_WebMessageReceived(object sender, CoreWebView2WebMessageReceivedEventArgs e)
{
var message = e.WebMessageAsJson;
// 简单判断消息类型
if (message.Contains("\"type\":\"getSelection\""))
{
string selectedText = Globals.ThisAddIn.Application.Selection?.Text ?? "";
SendSelectedTextToWebView(selectedText);
}
}
public void SendSelectedTextToWebView(string text)
{
// 发送事件回网页,传回选中内容
string escaped = System.Text.Json.JsonSerializer.Serialize(text); // 自动处理引号等
string js = $"window.dispatchEvent(new CustomEvent('wordSelectionChanged', {{ detail: {escaped} }}));";
webView21.ExecuteScriptAsync(js);
}
}
```
---
## ✅ 效果
* Web 页点击按钮 ➜ 向宿主请求选中内容
* 宿主获取 Word 的选中文本 ➜ 回传给 Web 页
* Web 页展示选中内容(或用于其他用途)