作者:咕魂
时间:2022年5月6日
大量博文可以看到一些C#与JS脚本相互调用的案例,但是不同版本的CefSharp使用时还是有一点不同,博主本次使用的CefSharp版本为100.0.230.0,查看方法按住Ctrl点击ChromiumWebBrowser可以看到程序集开头有写到版本号。
接下来是正文:
JS调用C#函数
// 使用ChromiumWebBrowser时进行的状态设置
// 其中chromiumWebBrowser为实例化的ChromiumWebBrowser对象,
// CefSharpSettings是直接设置静态类的属性,也能先创建对象,但是没必要
chromiumWebBrowser.JavascriptObjectRepository.Settings.LegacyBindingEnabled = true;
CefSharpSettings.WcfEnabled = true;
chromiumWebBrowser.JavascriptObjectRepository.Register("bound", new BoundObject(), isAsync: false, options: BindingOptions.DefaultBinder);
// BoundObject.class的写法
class BoundObject
{
public string hello()
{
return "hello";
}
}
注:旧版本使用
chromiumWebBrowser.RegisterJsObject("bound", new BoundObject(), options: BindingOptions.DefaultBinder);
并且博主使用时直接使用“CefSharpSettings.LegacyBindingEnabled会出现
LegacyBindingEnabled`未定义的错误。
html中调用函数的代码:
<script>
// 如果bound对象存在,则调用bound中的hello函数
// 注意此处bound字段一定要和之前代码Register函数的第一个参数一致
if(bound){
console.log(bound.hello());
}
</script>
不出意外,你能够在C#程序运行后,查看浏览器组件的控制台,可以看到hello的输出信息。
C#调用JS函数
// 其中chromiumWebBrowser为实例化的ChromiumWebBrowser对象
string javascript = "hello();";
chromiumWebBrowser.ExecuteScriptAsync(javascript);
html中的代码
<script>
function hello(){
console.log("hello")
}
</script>
如果你是和我一样,在chromiumWebBrowser
刚刚加载页面后就直接调用ExecuteScriptAsync()
函数执行JS脚本,不出意外应该会报一个hello未定义的错误。
但是如果把调用ExecuteScriptAsync()
的函数写在winform的按钮事件中,加载完页面之后,点击按钮再执行,就能够成功在浏览器组件的控制台看到输出的hello字样。
总结
按理来说,如果在页面刚刚加载就执行一段脚本从C#传数据过来,两种方法应该都是可行的,但C#调用JS函数时一定要等页面完整加载之后再调用,不然会出现函数未定义的情况,可以先查询一下页面加载的情况再执行,这里,我使用的是第一种(JS调用C#函数)方法,通过JS调用C#函数来传递数据。
之后如果html页面中的触发函数需要执行C#函数,就使用第一种(JS调用C#函数)方法,如果是winform组件的触发事件要执行JS函数,就使用第二章(C#调用JS函数)方法。
C#数据往JS部分传递两种方法都可以,但JS的数据往C#部分传递,则只能使用第一种(JS调用C#函数)方法。
提示
打开浏览器控制台的方法:
// 点击按钮button1打开控制台,也能写到其他chromiumWebBrowser初始化之后的地方
private void button1_Click(object sender, EventArgs e)
{
if (chromiumWebBrowser != null)
chromiumWebBrowser.ShowDevTools();
else
MessageBox.Show("浏览器暂未加载...");
}
相关连接:
cefsharp 如何成功获取加载完毕后,网页的源代码-前端-CSDN问答
CefSharp内核浏览器之C#与js的互相调用_饮尽鸿爪下的雪泥的博客-CSDN博客
升级CefSharp解决RegisterJsObject方法弃用问题_黑石雨的博客-CSDN博客
CefSharpSettings.LegacyJavascriptBindingEnabled 没有该属性 – 简书 (jianshu.com)