欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

Winform Cefsharp Webwiki C#与JS交互完整实现

程序员文章站 2022-07-06 15:18:20
目录最后的效果图CefSharp安装目录结构C#代码HTML 代码禁用右键菜单相关链接最后的效果图CefSharp安装目录结构C#代码using System;using System.Windows.Forms;using CefSharp;using CefSharp.WinForms;namespace WebWikiTest{ public partial class Form1 : DevEx......

目录

源码文件

最后的效果图

CefSharp安装

目录结构

C#代码

HTML 代码

禁用右键菜单

相关链接


 

源码文件

 

最后的效果图

Winform Cefsharp Webwiki C#与JS交互完整实现

 

CefSharp安装

Winform Cefsharp Webwiki C#与JS交互完整实现

 

目录结构

Winform Cefsharp Webwiki C#与JS交互完整实现

 

C#代码

using System;
using System.Windows.Forms;
using CefSharp;
using CefSharp.WinForms;

namespace WebWikiTest
{
    public partial class Form1 : DevExpress.XtraEditors.XtraForm
    {
        /// <summary>
        /// web控件
        /// </summary>
        private ChromiumWebBrowser browser;

        public Form1()
        {
            InitializeComponent();
        }

        private void Form1_Load(object sender, EventArgs e)
        {
            // 初始化页面
            browser = new ChromiumWebBrowser(GetApplicationPath() + "\\index.html");

            // 布局 添加到页面
            this.browser.Width = 800;
            browser.Dock = DockStyle.Right;
            this.Controls.Add(browser);

            // 注入类到页面
            browser.JavascriptObjectRepository.ResolveObject += (s, eve) =>
            {
                var repo = eve.ObjectRepository;
                if (eve.ObjectName == "jsevent")
                {
                    //repo.Register("jsevent", new JsEvent(), isAsync: true, options: BindingOptions.DefaultBinder);
                    repo.Register("jsevent", new JsEvent(GetApplicationPath() + "\\index.html"), isAsync: true, options: BindingOptions.DefaultBinder);
                }
            };

        }

        /// <summary>
        /// 获取根目录
        /// </summary>
        /// <returns></returns>
        private static string GetApplicationPath()
        {
            string path = Application.StartupPath;
            string folderName = String.Empty;
            while (folderName.ToLower() != "bin")
            {
                path = path.Substring(0, path.LastIndexOf("\\"));
                folderName = path.Substring(path.LastIndexOf("\\") + 1);
            }
            return path.Substring(0, path.LastIndexOf("\\") + 1);
        }

        /// <summary>
        /// C#按钮调用js方法
        /// </summary>
        /// <param name="sender"></param>
        /// <param name="e"></param>
        private void simpleButton1_Click(object sender, EventArgs e)
        {
            // 打开console
            browser.ShowDevTools();

            // 请求js方法
            this.browser.ExecuteScriptAsync("clickMe", new object[] { });
        }

        /// <summary>
        /// 注入到页面的类
        /// </summary>
        public class JsEvent
        {
            private string _url;
            public JsEvent()
            {
            }

            public JsEvent(string url)
            {
                _url = url;
            }

            public string showTest()
            {
                MessageBox.Show("Test OK");
                return "调用C# 方法成功";
            }

            public string getUrl()
            {
                return _url;
            }
        }
    }
}

 

HTML 代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>webwiki test</title>
</head>
<body>
    <div id='app'>
        <ul>
            <li v-for="i in list">{{i}}</li>
        </ul>
        <button @click="clickMe">ClickMe</button>
    </div>
    <button onclick="a()">ClickMe2</button>
    <button onclick="b()">ClickMe3</button>

    <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
    <script>
        var vm = new Vue({
            el: '#app',
            data() {
                return {
                    list: [1, 2, 3, 4, 5, 6, 7, 8, 9],
                }
            },
            methods: {
                clickMe: function () {
                    console.log("vue click test");
                },
            },
        })

        // 页面中绑定C#类
        CefSharp.BindObjectAsync("jsevent");
        
        function a() {
            console.log("调用C# 方法测试");
            console.log(jsevent.showTest());
        }

        // C#中调用的clickMe方法
        function clickMe() {
            console.log("触发js 执行click");
        }

        // 较方法a 多了一步解析Promise 
        function b() {
            jsevent.getUrl().then((d) => {
                console.log("调用C#方法获得的返回值是:"+d);
            })
        }

    </script>
</body>
</html>

 

禁用右键菜单

// 注册MenuHandler 写在ChromiumWebBrowser控件实例化后面
this.browser.MenuHandler = new MenuHandler();


/// <summary>
/// 禁用右键菜单 MenuHandler类 随便找个位置写 比如内部类
/// </summary>
public class MenuHandler : IContextMenuHandler
{
    public void OnBeforeContextMenu(IWebBrowser browserControl, IBrowser browser, IFrame frame, IContextMenuParams parameters, IMenuModel model)
    {
        model.Clear();
    }
    public bool OnContextMenuCommand(IWebBrowser browserControl, IBrowser browser, IFrame frame, IContextMenuParams parameters, CefMenuCommand commandId, CefEventFlags eventFlags)
    {
        return false;
    }
    public void OnContextMenuDismissed(IWebBrowser browserControl, IBrowser browser, IFrame frame)
    {
    }
    public bool RunContextMenu(IWebBrowser browserControl, IBrowser browser, IFrame frame, IContextMenuParams parameters, IMenuModel model, IRunContextMenuCallback callback)
    {
        return false;
    }
}

 

相关链接

本文地址:https://blog.csdn.net/weixin_44734310/article/details/113972129

相关标签: winform