c#如何调用js的方法

C# 调用 JS 方法的几种方式有：通过WebBrowser控件、使用WebView2、通过SignalR、通过Blazor框架。本文将详细介绍每种方法的使用场景和具体实现步骤。

一、通过WebBrowser控件

在Windows Forms或WPF应用程序中，WebBrowser控件是一个常见的嵌入式浏览器控件，可以用来显示HTML页面并与JavaScript进行交互。

1.1、基本原理

WebBrowser控件可以加载HTML页面，并且通过它的Document.InvokeScript方法，可以调用页面中的JavaScript函数。

1.2、示例代码

首先，确保你已经在Windows Forms应用程序中添加了一个WebBrowser控件。然后，你可以使用以下代码来调用JavaScript函数。

// 加载HTML页面
webBrowser1.DocumentText = "<html><head></head><body><script type='text/javascript'>function showMessage(message) { alert(message); }</script></body></html>";
// 调用JavaScript函数
webBrowser1.Document.InvokeScript("showMessage", new object[] { "Hello from C#" });

在上述示例中，HTML页面中定义了一个名为showMessage的JavaScript函数。通过webBrowser1.Document.InvokeScript方法，我们可以从C#代码中调用这个函数，并传递一个参数。

二、使用WebView2

WebView2是一个新的控件，它基于Microsoft Edge (Chromium)内核，提供了更现代和更强大的Web功能。

2.1、基本原理

WebView2允许你在WPF和WinForms应用程序中嵌入Web内容，并且可以通过其JavaScript接口与C#代码进行交互。

2.2、示例代码

首先，确保你已经安装了WebView2控件。你可以通过NuGet包管理器安装Microsoft.Web.WebView2包。

// 初始化WebView2控件
await webView.EnsureCoreWebView2Async(null);
// 加载HTML页面
webView.CoreWebView2.NavigateToString("<html><head></head><body><script type='text/javascript'>function showMessage(message) { alert(message); }</script></body></html>");
// 调用JavaScript函数
webView.CoreWebView2.ExecuteScriptAsync("showMessage('Hello from C#')");

在上述示例中，我们使用WebView2控件加载了一个HTML页面，并通过ExecuteScriptAsync方法调用了页面中的JavaScript函数。

三、通过SignalR

SignalR是一个用于构建实时Web应用程序的库。它可以在客户端和服务器之间建立双向通信通道。

3.1、基本原理

通过SignalR，我们可以在C#服务器端代码中调用客户端的JavaScript函数。

3.2、示例代码

首先，确保你已经安装了SignalR的相关NuGet包。然后，你可以使用以下代码来设置SignalR服务器和客户端。

服务器端代码：

using Microsoft.AspNetCore.SignalR;
public class MyHub : Hub
{
    public async Task CallClientMethod(string message)
    {
        await Clients.All.SendAsync("showMessage", message);
    }
}

客户端代码：

const connection = new signalR.HubConnectionBuilder()
    .withUrl("/myHub")
    .build();
connection.on("showMessage", function(message) {
    alert(message);
});
connection.start().catch(function (err) {
    return console.error(err.toString());
});

在上述示例中，我们在服务器端定义了一个SignalR Hub，并在其中定义了一个方法CallClientMethod。在客户端，我们监听了一个名为showMessage的事件，并在事件触发时显示一个警告框。

四、通过Blazor框架

Blazor是一个用于构建交互式Web UI的框架。它允许你使用C#代替JavaScript来构建Web应用程序。

4.1、基本原理

Blazor提供了JavaScript互操作功能，允许你从C#代码中调用JavaScript函数。

4.2、示例代码

首先，确保你已经创建了一个Blazor项目。然后，你可以使用以下代码来调用JavaScript函数。

C#代码：

@page "/calljs"
@inject IJSRuntime JSRuntime
<button @onclick="CallJsFunction">Call JavaScript Function</button>
@code {
    private async Task CallJsFunction()
    {
        await JSRuntime.InvokeVoidAsync("showMessage", "Hello from Blazor");
    }
}

JavaScript代码：

window.showMessage = function(message) {
    alert(message);
}

在上述示例中，我们在Blazor组件中定义了一个按钮，并在按钮点击时调用JavaScript函数showMessage。

五、总结

通过上述几种方法，我们可以在C#代码中调用JavaScript函数。不同的方法适用于不同的应用场景：

WebBrowser控件：适用于传统的Windows Forms和WPF应用程序。
WebView2：适用于需要更现代Web功能的Windows Forms和WPF应用程序。
SignalR：适用于需要实时通信的Web应用程序。
Blazor：适用于希望使用C#代替JavaScript构建Web应用程序的开发者。

每种方法都有其优缺点，开发者可以根据具体需求选择合适的方法。无论选择哪种方法，都需要确保在调用JavaScript函数之前，HTML页面已经加载完成，并且JavaScript函数已经定义好。