原文:C# 用XiliumCefGlue做浏览器,JS和C#相互调用

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/u013564470/article/details/78395984

目录:



XiliumCefGlue初始化,最精简Demo

XiliumCefGlue源码地址

Xilium.CefGlue手册【百度网盘下载,密码:j093】

【推荐】XiliumCefGlueDemo 2.3.0.0(吾乐吧软件站原创)

以上链接是参考资料!此例程中本着精简易懂的原则,把很多不需要的东西去掉,包括try等检查代码。下面开始步入正题。

1.解压压缩包得到下列文件。选择需要的文件复制到自己工程【pdb为调试生成文件不需要】,之后将【Xilium.CefGlue】和【Xilium.CefGlue.WindowsForms】添加到引用。



只选取了一部分需要的文件放到Debug文件夹下。



2.其中Form.cs中代码如下,添加panl控件让浏览器嵌入其中。Form1_Load的引用在Form1.Designer.cs中。代码中的网址 http://www.e0575.com/web/ie6bye/test/是对CSS3进行测试的网页。

using System.Windows.Forms;

using Xilium.CefGlue;
using Xilium.CefGlue.WindowsForms;
namespace XCdemo
{
public partial class Form1 : Form
{
CefWebBrowser browser = new CefWebBrowser();
public Form1()
{
InitializeComponent();
Form1_Load();
}
private void Form1_Load()
{
browser.Dock = DockStyle.Fill;
browser.StartUrl = @"http://www.e0575.com/web/ie6bye/test/";
panel1.Controls.Add(browser);
}
}
}

3.其中Program.cs中的代码要做更改,要在程序启动前初始化。

using System;
using System.Collections.Generic;
using System.Linq;
using System.Windows.Forms; using Xilium.CefGlue; namespace XCdemo
{
static class Program
{
/// <summary>
/// 应用程序的主入口点。
/// </summary>
[STAThread]
private static void Main(string[] args)
{
CefRuntime.Load();
var mainArgs = new CefMainArgs(args);
var app = new DemoApp();
var exitCode = CefRuntime.ExecuteProcess(mainArgs, app);
var settings = new CefSettings
{
SingleProcess = false,
MultiThreadedMessageLoop = true,
LogSeverity = CefLogSeverity.Disable,
LogFile = "CefGlue.log",
};
CefRuntime.Initialize(mainArgs, settings, app);
Application.EnableVisualStyles();
Application.SetCompatibleTextRenderingDefault(false);
if (!settings.MultiThreadedMessageLoop)
{
Application.Idle += (sender, e) => { CefRuntime.DoMessageLoopWork(); };
}
Application.Run(new Form1());
CefRuntime.Shutdown();
}
internal sealed class DemoApp : CefApp
{
protected override void OnBeforeCommandLineProcessing(string processType, CefCommandLine commandLine)
{
;
}
}
}
}

4.在程序运行前,把项目的平台目标更改为X86之后运行。

代码下载链接http://download.csdn.net/download/u013564470/10046278



Xilium.CefGlue,JS调用C#代码

1.Xilium.CefGlue中JS调用C#比较繁琐。需要通过反射机制注册c#函数到JS。因为涉及到的文件较多,而且已经和别的代码混在一起就不一一列举了,这里只列举关键部分。详细参考第2篇:Xilium CefGlue 关于 CLR Object 与 JS 交互类库封装报告:导航篇

public CefV8Handler Cef;
//通过反射机制 注册c#函数到JS
public void RegisterJs()
{
JsEvent js = new JsEvent();
Cef = new CefJsV8Handler(js);
string javascriptCode = CefJavaScriptEx.CreateJsCodeByObject(js, "Cef");
CefRuntime.RegisterExtension("Cef", javascriptCode, Cef);
}
protected override void OnWebKitInitialized()
{
//注册JS函数
RegisterJs();
}
public class JsEvent
{
public Object MyParam { get; set; }
public Object GetMyParam(){
if (MyParam.GetType().IsArray){
String s = "[";
Object[] o = (Object[])MyParam;
for (int i = 0; i < o.Length; i++){
s += "'" + o[i].ToString() + "'";
if (i < (o.Length - 1))
s += ",";
}
s += "]";
return s;
}
return MyParam;
}
[DllImport("User32.dll", EntryPoint = "SendMessage")]
private static extern int SendMessage(int hWnd, int Msg, int wParam, ref COPYDATASTRUCT lParam);
[DllImport("User32.dll", EntryPoint = "FindWindow")]
private static extern int FindWindow(string lpClassName, string lpWindowName);
public void openMyPc(String dir){
if( dir == null)
dir = "::{20D04FE0-3AEA-1069-A2D8-08002B30309D}";
Process.Start("explorer.exe", dir);
}
}

上述代码功能为,执行JS页面的代码,调用C#的函数,打开指定的文件夹,参数为空时打开我的电脑。





Xilium.CefGlue,C#调用JS代码(无返回值)

相对于JS调用C#函数,C#调用JS函数就简单多了。直接调用封装的库函数即可,不过此函数之恩那个调用JS函数却不能获得JS函数的返回值。代码如下:

CefFrame frame = browser.Browser.GetMainFrame();
String js = "test();";
if (js.Length > 1)
{
frame.ExecuteJavaScript(js, frame.Url, 0);
}

上述代码为调用JS页面的test()函数,函数圆形如下:

function test(){
alert("C#中调用了此函数!");
}

当C#中运行代码时,浏览器页面会弹窗提示“C#中调用了此函数!”。





Xilium.CefGlue,C#调用JS代码(有返回值)

很多时候当我们用C#调用JS函数时,需要JS给的返回值。然而封装的函数却不具备此功能。这时候我们需要把JS调用C#和C#调用JS结合起来实现JS和C#互调。思路如下,C#调用JS函数,函数的返回值调用C#函数,由于JS调用C#函数是一个新的实例,所以我们需要进程间通信,将得到的信息传回给主程序。主要代码为注册下列C#函数到JS。

const int WM_COPYDATA = 0x004A;
public void JS2C(String dir)
{
int hWnd = FindWindow(null, @"JS和c#代码互调");
if (hWnd == 0)
{
MessageBox.Show("555,未找到消息接受者!");
}
else
{
byte[] sarr = System.Text.Encoding.Default.GetBytes(dir);
int len = sarr.Length;
COPYDATASTRUCT cds;
cds.dwData = (IntPtr)Convert.ToInt16(1);//可以是任意值
cds.cbData = len + 1;//指定lpData内存区域的字节数
cds.lpData = dir;//发送给目标窗口所在进程的数据
SendMessage(hWnd, WM_COPYDATA, 0, ref cds);
}
}

JS中代码如下

function testreturn(a){
var str = "返回值:";
str = str + a;
return Cef.JS2C(str);
}

之后我们正常调用ExecuteJavaScript函数即可。效果如下:


C# 用XiliumCefGlue做浏览器,JS和C#相互调用的更多相关文章

  1. WinForm中嵌入WebBrowser,并且支持C#和JS方法的相互调用

    纯粹WinForm界面不够友好,实现数据复杂度高的处理有些力不从心,所以看了看api以后决定用html来做. 我的wlw的代码插件不是很好用,大家凑合看吧 类前说明引用和权限 1: [Permissi ...

  2. java与js交互,相互调用传参

    随着前端技术的发展与H5的广泛使用,移动端采用native+h5的方式越来越多了,对于Android来说就涉及到java与js的交互,相互调用传参等.下面就来看一下java与js交互的简单demo. ...

  3. iOS JS 和 OC交互 / JS 和 native 相互调用

    现在app 上越来越多需求是通过UIWebView 来展示html 或者 html5的内容, js 和 native OC代码交互 就非常常见了. js 调用 native  OC代码 第一种机制 ( ...

  4. iOS 关于js与OC相互调用的那些事

    最近项目上使用js调用OC,OC再次调用JS,再次在JS页面上面回显数据. 项目中使用的是WKWebview,加载网路的URL,其实就是使用WK加载出来的H5网页,在项目中用的是H5网页有个识别按钮, ...

  5. iOS下JS与OC互相调用(一)--UIWebView 拦截URL

    最近准备把之前用UIWebView实现的JS与原生相互调用功能,用WKWebView来替换.顺便搜索整理了一下JS 与OC 交互的方式,非常之多啊.目前我已知的JS 与 OC 交互的处理方式: * 1 ...

  6. Ajax清除浏览器js、css、图片缓存的方法

    做东东时都是把图片在服务器的地址存放在数据库里面,然后到浏览器中显示,但是后来发现了两个问题. 第一:为了安全起见,js是无法读取本地的图片的,不然你写一个js,岂不是可以获取任何人电脑里面的文件了. ...

  7. atitit..主流 浏览器 js 发动机 内核 市场份额 attialx总结vOa9

    atitit..主流 浏览器 js 发动机  内核 市场份额 attialx总结vOa9 1. 浏览器内核 1 2. 浏览器的主要组件包含: 2 2.1. 主要组件体系结构 2 2.2. WebCor ...

  8. 《笔记篇》非JS方法跳转到一个新页面,主要防止客户端禁止浏览器JS以后的跳转异常

    用非JS方法打开一个新页面,主要防止客户端禁止浏览器JS以后的跳转失效 <meta http-equiv="refresh" content="0; url=htt ...

  9. 移动端IOS和androi及浏览器js判断[转载]

    转载自:http://www.niutifa.com/?p=561 移动端IOS和androi及浏览器js判断: <script type="text/javascript" ...

随机推荐

  1. POJ 1562 Oil Deposits (HDU 1241 ZOJ 1562) DFS

    现在,又可以和她没心没肺的开着玩笑,感觉真好. 思念,是一种后知后觉的痛. 她说,今后做好朋友吧,说这句话的时候都没感觉.. 我想我该恨我自己,肆无忌惮的把她带进我的梦,当成了梦的主角. 梦醒之后总是 ...

  2. 【42.59%】【codeforces 602A】Two Bases

    time limit per test1 second memory limit per test256 megabytes inputstandard input outputstandard ou ...

  3. [Vue] Preload Data using Promises with Vue.js and Nuxt.js

    Nuxt.js allows you to return a Promise from your data function so that you can asynchronously resolv ...

  4. php实现栈的压入、弹出序列(**)(算法步骤)(画图)

    php实现栈的压入.弹出序列(**)(算法步骤)(画图) 一.总结 1.算法步骤:一定要把算法步骤写下来,要不然太浪费时间了,尤其是思维不清晰的时候,尤其是题目有难度的时候,不然的话也非常容易出现低级 ...

  5. Thinking in UML 学习笔记(四)——UML核心视图之活动图

    在UML中活动图的本质就是流程图,它描述了为了完成某一个目标需要做的活动以及这些互动的执行顺序.UML中有两个层面的活动图,一种用于描述用例场景,另一种用于描述对象交互. 活动图只是我们用来描述业务目 ...

  6. [Vue] Update Attributes, Classes and Styles in Vue.js with v-bind

    Use v-bind:class and v-bind:style to compute html classes and inline styles from component data. Vue ...

  7. node转发formdata

    router.post('/keUpload', checkLogin, setAccessControlAllow, (req, res, next) => { const busboy = ...

  8. 动态获取server时间

    近期在做的这个项目要获取到后台的数据.然后使用html5绘制曲线.曾经都是在自己电脑上使用没有发现有什么不正常的地方,昨天连接同事的server发现有段数据怎么都对不上了,開始我还以为程序有问题呢,找 ...

  9. 忙里偷闲( ˇˍˇ )闲里偷学【C语言篇】——(1)GCC介绍及C语言编译过程

    一.GCC基本介绍 GCC(GNU Compiler Collection,GNU编译器套装),是一套由GNU开发的编程语言编译器.它是一套以GPL及LGPL许可证所发布的自由软件,也是GNU计划的关 ...

  10. python3 numpy基本用法归纳总结

    安装numpy : pip install numpy numpy数组生成方法总结 In [4]: import numpy as np #使用列表生成一个一维数组 data = [1,2,3,4,5 ...