[WPF] WebView2와 WPF(C#)와 Javascript 통신

1. WPF의 페이지 그리드 내에 테스트를 위한 WebView2에 올립니다.

  (WebView2는 누겟설치)

<Window ...
       xmlns:wv2="clr-namespace:Microsoft.Web.WebView2.Wpf;assembly=Microsoft.Web.WebView2.Wpf"
       ...
       >
    <Grid>
         <wv2:WebView2 x:Name="webView" />
    </Grid>
</Window>

 

2. 비하인드 코드에 아래와 같이 URL을 Navigate 합니다.

// webView에 보이고자하는 페이지 url로 Navigate합니다.
webView.CoreWebView2.Navigate(url);

// 또 다른 방법
webView.Source = new Uri(url);

3. Javascript에서 C#으로 메세지 전달

// 생성자 혹은 Loaded이벤트에 아래의 이벤트핸들러를 이용합니다.
webView.CoreWebView2.WebMessageReceived += CoreWebView2_WebMessageReceived;

// Javascript에서 PostMessage를 발송시 C#에서 수신하는 코드를 작성합니다.
private void CoreWebView2_WebMessageReceived(object sender, Microsoft.Web.WebView2.Core.CoreWebView2WebMessageReceivedEventArgs e)
{
    // JS에서 window.chrome.webview.postMessage를 이용하여 호출할 경우.
    // e.WebMessageAsJson 를 이용하여 원하는 작업을 합니다.
}

// JS에서 window.chrome.webview.postMessage 외에 window.postMessage로 호출하여도 동작은 유사합니다.

 

https://learn.microsoft.com/en-us/dotnet/api/microsoft.web.webview2.core.corewebview2.addhostobjecttoscript?view=webview2-dotnet-1.0.1462.37 

CoreWebView2.AddHostObjectToScript(String, Object) Method (Microsoft.Web.WebView2.Core)