JavaScript与C# Windows应用程序交互方法

本文将介绍在 Windows 应用程序中如何实现 JavaScript 与 C# 相互通信的方法，主要包括以下内容：

1. 通过 WebView 控件实现 JavaScript 与 C# 的通信
2. JavaScript 调用 C# 方法示例
3. C# 调用 JavaScript 方法示例
4. 实现 JavaScript 调用 C# 的回调函数

通过 WebView 控件实现 JavaScript 与 C# 的通信

WebView 是一种可在 Windows 应用程序中嵌入 Web 内容的控件。当 WebView 控件载入一个 HTML 页面时，它会为这个页面创建一个 JavaScript 运行环境，这使得我们能够直接在 C# 中与 JavaScript 进行交互。

要实现 JavaScript 与 C# 的通信，我们需要使用 WebView 的 InvokeScript 方法，它能够让我们在 JavaScript 和 C# 之间调用方法和属性。

下面我们将通过两个示例来介绍如何实现 JavaScript 与 C# 的交互。

JavaScript 调用 C# 方法示例

在 HTML 页面中声明一个按钮，当点击按钮时调用以下 JavaScript 方法：

function callCSharpMethod() {
    window.external.notify("Hello from JavaScript");
}

在 C# 中，我们需要通过 WebView 控件获取到 JavaScript 运行环境。具体的代码如下：

private void WebView_LoadCompleted(object sender, NavigationEventArgs e)
{
    WebView webView = sender as WebView;
    webView.AddWebAllowedObject("bridge", new Bridge());
}

public class Bridge
{
    public void Notify(string message)
    {
        Debug.WriteLine(message);
    }
}

在这段代码中，我们首先通过 AddWebAllowedObject 方法把 Bridge 类实例化的对象添加到 JavaScript 的全局对象中，并将其命名为 bridge。然后在 JavaScript 中通过 window.external.notify 方法调用 Notify 方法，并传入一个字符串 Hello from JavaScript。Notify 方法的实现中将这个字符串输出到日志中。

当我们在 HTML 页面中点击按钮时，Notify 方法将会执行，同时打印出日志信息。

C# 调用 JavaScript 方法示例

接下来，我们将介绍如何在 C# 中调用 JavaScript 的方法。

首先在 HTML 文件中定义以下 JavaScript 函数：

function showWindowsDialog() {
    var result = prompt("请输入一个数值：", 0);
    document.getElementById("msg").innerHTML = "您输入的数值是：" + result;
}

在 C# 中，我们可以通过以下代码来调用该函数：

private async void CallJavascriptFunction()
{
    string script = "showWindowsDialog();";
    await webView.InvokeScriptAsync("eval", new string[] { script });
}

在这段代码中，我们通过 InvokeScriptAsync 方法调用了 JavaScript 的 showWindowsDialog 函数，并在执行完成后将返回的结果赋值到名为 result 的变量中。

实现 JavaScript 调用 C# 的回调函数

有时候我们需要从 C# 中获取一些数据，并在 JavaScript 中进行相应的处理。这时候，我们需要实现一个 JavaScript 回调函数，使得 C# 能够在获取到数据之后，将数据作为参数传递给 JavaScript 并触发这个回调函数。

在 C# 中，我们需要编写一个委托（代表 JavaScript 回调函数的方法），并在调用 JavaScript 方法时将这个委托传递给 JavaScript。

以下是一个示例代码：

public delegate void GetDataCallback(string data);

public async void GetData(GetDataCallback callback)
{
    var result = // 从某个地方获取到数据
    callback(result); // 调用回调函数
}

在 JavaScript 中，我们需要定义一个全局函数来接收传回来的数据：

function onDataReceived(data) {
    document.getElementById("msg").innerHTML = "我们从 C# 中获取到的数据是：" + data;
}

调用 C# 的 GetData 方法，并传递 onDataReceived 函数为回调函数的参数：

function callCSharpGetData() {
    window.external.notify("GetData", onDataReceived);
}

在这段 JavaScript 中，我们调用了 C# 的 GetData 方法，并将 onDataReceived 函数作为第二个参数传入，这样当 GetData 方法获取到数据时，就可以直接调用 onDataReceived 函数，把数据传递给 JavaScript。

结论

通过 WebView 控件，我们可以很方便地实现 JavaScript 和 C# 之间的通信。无论是从 JavaScript 中调用 C# 方法，还是在 C# 中调用 JavaScript 方法，都可以用这种方法来实现。如果还需要实现 JavaScript 调用 C# 的回调函数，也可以借助这种方法轻松地完成。