CoreWebView2_WebMessageReceived 没有被触发

Question

我有一个带有简单按钮和文本框的 Angular Web 应用程序。 此应用程序将由 WPF 用户控件中包含的 WebView2 控件加载。

我希望在单击按钮时为文本框文本发送一个 JSON 字符串。 此 JSON 字符串将作为消息发布到 WebView2，从而由用户控件进一步处理。 但是，事件“WebMessageReceived”的事件处理程序未在用户控件类中触发。

这里是所有的代码： 角度： Handler.js:

exports.SendMessageToParent=function (jsonObject){
    console.log("function called");
    window.parent.postMessage(jsonObject,'*');
    window.parent.close();
}

app.component.ts:

import { Component, OnInit } from '@angular/core';
import {SendMessageToParent} from '../app/Handlers.js';

  OnClick(){
  console.log(this.webtext)
  const JSONData = {Key1: this.webtext};
  const jsonObject = JSON.stringify(JSONData);
  
  SendMessageToParent(jsonObject);
  }

用户控制类：EDITED

private async void Initialize()
{
            webView2.CoreWebView2InitializationCompleted += 
                                WebView2_CoreWebView2InitializationCompleted;
    await webView2.EnsureCoreWebView2Async();
    

}

private async void WebView2_CoreWebView2InitializationCompleted(object? sender, CoreWebView2InitializationCompletedEventArgs e)
{
    if(e.IsSuccess)
    {
        webView2.CoreWebView2.Navigate("http://localhost:4200/");
        await webView2.CoreWebView2.AddScriptToExecuteOnDocumentCreatedAsync(
            "window.addEventListener('message', event => 
            {window.chrome.postMessage(event.data);})"
            );
        webView2.CoreWebView2.WebMessageReceived += CoreWebView2_WebMessageReceived;
    }
}

private void CoreWebView2_WebMessageReceived(object? sender, CoreWebView2WebMessageReceivedEventArgs e)
{
    // Deserialize JSON data
    var data = JsonSerializer.Deserialize<string>(e.WebMessageAsJson);

    // Raise event with incoming data
    WebDataReceived?.Invoke(this, data);
}

Answer 1

在上面你应该调用

window.chrome.postMessage

的时候调用了

window.chrome.webview.postMessage

。有关更多信息，请参阅window.postMessage VS window.chrome.webview.postMessage 和WebView2 postMessage 文档。

        await webView2.CoreWebView2.AddScriptToExecuteOnDocumentCreatedAsync(
            "window.addEventListener('message', event => 
            {window.chrome.webview.postMessage(event.data);})"
            );