目录
源码文件
最后的效果图
CefSharp安装
目录结构
C#代码
HTML 代码
禁用右键菜单
相关链接
源码文件
最后的效果图
CefSharp安装
目录结构
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;
}
}
相关链接
- CefSharp
- WinForm使用CefSharp内嵌chrome浏览器
- [CefSharp] 如何在JavaScript中调用C#代码
- Cefsharp C#与JS交互
本文地址：https://blog.csdn.net/weixin_44734310/article/details/113972129
