CefSharp is a Chromium browser embedded to an application.

In my case, I’m using WinForms (CefSharp.WinForms v57.0.0).

What I want to achieve here:

When user click on the <a> element, the C# code there need to perform some action.

How it can be done

In C# code

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
...
public void InitBrowser()
{
    ...
    browser = new ChromiumWebBrowser("http://yoursite.com");
    ...

    var eventObject = new ScriptedMethodsBoundObject();
    eventObject.EventArrived += OnJavascriptEventArrived;
    browser.RegisterJsObject("boundEvent", eventObject, options: BindingOptions.DefaultBinder);
}
...
public static void OnJavascriptEventArrived(string eventName, object eventData)
{
    var jsonString = eventData.ToString();
    var serializer = new System.Web.Script.Serialization.JavaScriptSerializer();
    var dataDict = serializer.Deserialize<Dictionary<string, object>>(jsonString);

    Console.WriteLine("Event arrived: {0}", eventName); // output 'click'

    switch (eventName)
    {
        case "click":
        {
            // do whatever you want here
            Console.WriteLine(dataDict["data1"]); // output 'foo'
            Console.WriteLine(dataDict["data2"]); // output 'bar'
            break;
        }
    }
}

In JavaScript code

1
2
3
4
5
6
7
8
9
10
$('a').click(function(e) {
  if (!window.boundEvent) {
    console.log('window.boundEvent does not exist.');
    return;
  }   
  window.boundEvent.raiseEvent('click', JSON.stringify({
    data1: 'foo',
    data2: 'bar'
  }));
});