天天看点

使用CEfSharp之旅(2) js前台事件执行后台方法

记录工作使用心得。

使用过程中想用js调用后台事件,如果做那?

不像正常接口可以直接调用访问。其实这个问题CEFSharp的设计者们,早就想好了。

那就是通过调用 JavascriptResponse 类来执行后台时间。

你可以在代码中load js 到浏览器中。js内容调用你的后台事件。 下面就是一个简单的列子。

示例代码均已上传github    git地址

static ChromiumWebBrowser web;
        private void Browserform_Load(object sender, EventArgs e)
        {
            try
            {
                web = new ChromiumWebBrowser("www.baidu.com");  
                web.Dock = DockStyle.Fill;
                web.RequestHandler = re;
                web.FrameLoadStart += Web_FrameLoadStart;
                web.FrameLoadEnd += Web_FrameLoadEnd;
                web.LoadingStateChanged += Web_LoadingStateChanged;
                this.Invoke(new Action(() =>
                {
                    this.Controls.Add(web);
                }));

                //browser表示你的CefSharp对象使用它的RegisterJsObject来绑定你的.net类  
                web.RegisterJsObject("bound", new BoundObject());

                //在实际的JS代码中,你将使用这样的对象:
                //bound.myProperty; // 使用此语法访问属性 

                //bound.myMethod(); // 使用此调用方法。

            }
            catch (Exception ex)
            {
               // MessageBox.Show(ex.ToString());
            }
           

将js事件通过注册进入页面,通过

bound.myMethod(); 访问后台方法。
           
bound.MyProperty 访问后台属性。
           
private async Task initmethodAsync()
        {
            string js_func = "";        
            js_func += " var all = $(\"div[class='ng-scope']\"); for (i = 0; i < all.length; i++) { all[i].onclick = onNickName; }";
            js_func += " function onNickName() {bound.myMethod($(this).find('span').eq(0).text(),$(this).find('img').eq(0).attr('src'));}; ";
            JavascriptResponse x = await web.EvaluateScriptAsync(js_func);
        }
           

C# 事件响应类:

public class BoundObject
    {
        public string MyProperty { get; set; }
        public void MyMethod(string ShowNickName,string html)
        {
            try
            {
              Console.WriteLine("我来响应前台的的事件");
            }
            catch (Exception ex)
            {

            }
        }
     
    }
           

怎么样,小伙伴们。挺简单的把? 来试试把。

继续阅读