如何在CefSharp中成功调用JavaScript代码？

CefSharp 是一个用于 .NET 平台的 Chromium 嵌入框架，它允许开发者在 Windows Forms 或 WPF 应用程序中嵌入 Chromium 浏览器，通过 CefSharp，你可以非常方便地在 .NET 应用中调用 JavaScript 代码，实现与前端页面的交互。

如何在 CefSharp 中调用 JavaScript

1. 初始化 CefSharp

在使用 CefSharp 之前，需要先进行一些初始化设置，你需要下载并引用 CefSharp 的 NuGet 包，然后创建一个ChromiumWebBrowser 对象并将其添加到你的窗体或控件中。

using CefSharp;
using CefSharp.WinForms; // 如果使用 WinForms
public partial class MainForm : Form
{
    private ChromiumWebBrowser browser;
    public MainForm()
    {
        InitializeComponent();
        InitializeChromium();
    }
    private void InitializeChromium()
    {
        // 配置 CefSharp
        CefSettings settings = new CefSettings();
        Cef.Initialize(settings);
        // 创建 ChromiumWebBrowser 对象
        browser = new ChromiumWebBrowser("https://www.example.com");
        this.Controls.Add(browser);
        browser.Dock = DockStyle.Fill;
    }
}

2. 加载网页后执行 JavaScript

你可以在网页加载完成后执行 JavaScript 代码，可以通过Frame.ExecuteScriptAsync 方法来异步执行 JavaScript。

browser.LoadingStateChanged += (sender, args) =>
{
    if (!args.IsLoading)
    {
        // 网页加载完成后执行 JavaScript
        browser.EvaluateScriptAsync("console.log('Hello from C#!');");
    }
};

3. 从 JavaScript 回调到 C#

如果你需要在 JavaScript 中调用 C# 代码，可以使用RegisterJsObject 方法注册一个 C# 对象，然后在 JavaScript 中调用该对象的方法。

public class JsInterop
{
    public void ShowMessage(string message)
    {
        MessageBox.Show(message);
    }
}
// 注册 JsInterop 对象
browser.RegisterJsObject("jsInterop", new JsInterop());

在 HTML/JavaScript 文件中可以这样调用：

<script type="text/javascript">
    jsInterop.ShowMessage("Hello from JavaScript!");
</script>

4. 表格示例：CefSharp 调用 JavaScript 的方式

方式	描述
EvaluateScriptAsync	异步执行 JavaScript 代码
RegisterJsObject	注册 C# 对象并在 JavaScript 中调用
ExecuteScriptAsync	同步执行 JavaScript 代码（不推荐在 UI 线程中使用）

相关问答 FAQs

Q1: 如何在 CefSharp 中捕获 JavaScript 异常？

A1: 在 CefSharp 中捕获 JavaScript 异常可以通过监听StatusChanged 事件来实现，当状态变为CefState.Error 时，可以获取错误信息。

browser.StatusChanged += (sender, args) =>
{
    if (args.NewValue == CefState.Error)
    {
        var request = browser.GetMainRequest();
        if (request != null)
        {
            Console.WriteLine($"Error: {request.Url} {args.NewValue}");
        }
    }
};

Q2: 如何在 CefSharp 中与 JavaScript 进行双向通信？

A2: 双向通信可以通过注册 C# 对象和使用 JavaScript 扩展来实现，注册一个 C# 对象，然后在 JavaScript 中调用该对象的方法，可以在 JavaScript 中触发事件，C# 端监听这些事件。

public class JsInterop
{
    public event Action<string> OnMessage;
    public void SendMessage(string message)
    {
        OnMessage?.Invoke(message);
    }
}
// 注册 JsInterop 对象
browser.RegisterJsObject("jsInterop", new JsInterop());

在 JavaScript 中：

<script type="text/javascript">
    jsInterop.OnMessage += function(message) {
        console.log("Received message: " + message);
    };
    jsInterop.SendMessage("Hello from JavaScript!");
</script>

小编有话说

CefSharp 是一个非常强大的工具，它使得在 .NET 应用中嵌入和控制 Chromium 浏览器变得非常简单，通过上述方法，你可以轻松地在 CefSharp 中调用 JavaScript，实现复杂的前后端交互，希望这篇文章对你有所帮助，如果有任何问题，欢迎留言讨论！