使用FireBreath写浏览器插件（二）

二. Firebreath的实际应用

去年我在给公司开发PC上Widget引擎，这个Widget引擎上面运行WebApp应用，界面和应用逻辑使用HTML+CSS+Javascript实现，而网页无法实现的功能则由CAR实现（CAR是与COM类似的技术，不过支持反射和AOP编程）。在这个引擎上开发的第一款应用是：类似于91手机助手的Android PC套件，整个PC套件的UI部分全部用HTML+CSS+Javascript实现，没有使用任何原生的控件（例如button），而JS无法完成的功能（例如获取联系人，安装apk包）则由CAR实现，然后在js中调用CAR。

其实扩展js功能，还有一种方法是使用现在网站常用的web service：在程序中实现一个http server，然后在http server中实现JS无法完成的功能，例如PC套件里面的获取联系人，最后再使用Ajax去调用。但为什么不选用这种方法呢？主要是基于如下几点原因：

1. 管理同步调用非常麻烦

2. js得处理参数转换

3. webservice除了本进程可以调用外，其他应用可以调用，安全认证比较麻烦

4. http无状态，长时间执行的操作得用一些特殊方式处理

5. 保持长连接也挺麻烦，回调机制的实现比较难办

6. 对象的生命周期管理难以与js的垃圾回收同步

7. 与本地UI交互困难。例如由于网页只能打开特定的对话框，如果应用要打开特定对话框（例如选取文件夹），webservice实现比较麻烦。

在我看来，C++里面的对象对JS而言，就应该和JS里面的原生对象（例如Date）是一样的，可以new对象，可以和原来一样地调用C++对象里面的方法，可以注册事件和触发事件，可以被垃圾回收。基于这个原则，并利用CAR的反射和事件回调机制，可以将CAR实现C++类动态注入到JS引擎中，使得JS可以轻松地调用C++对象。举个例子：

先写一个接口描述文件HelloWorld.car：

module
{interface IHelloRef {test([in] Int32 n, [out] AStringBuf<32> ret);}//回调函数callbacks JHelloRef {onTestCallback();}class CHelloRef {interface IHelloRef;constructor([in] Int32 abc);}
}

然后用emake编译HelloWorld.car可以生成相关的.h和.cpp文件，修改cpp文件为如下：

#include "CHelloRef.h"
#include "_CHelloRef.cpp"
#include <stdio.h>
#include <windows.h>
ECode CHelloRef::test(/* [in] */ Int32 n,  * [out] */AStringBuf* ret)
{printf("hello world\n");//触发回调Callback::onTestCallback();ret->Copy("hello world");ret->Append(n);//睡眠3秒后返回结果::Sleep(3000);return NOERROR;
}
ECode CHelloRef::constructor(Int32 abc)
{return NOERROR;
}

在js中可以这么调用：

var hello = new HelloWorld.CHelloRef(1234);
hello.onTestCallback = function(){window.alert('onTestCallback ’);
};
//调用test将触发onTestCallback，test的执行将耗时3秒以上，js引擎也会“卡死”3秒以上
var ret= hello.test(11);
//ret等于hello world11
alert(ret);
//异步调用,下面的js代码可以继续执行，而不至于js引擎卡死，结果返回时调用function
hello.test(32, function(ec, ret){//ret等于hello world32alert(ret);
});

最初我是采用在Webkit外壳上注入CAR的方式，但后面想在IE内核上跑应用时发现还得实现一遍注入，因为浏览器之间用的JS引擎接口不一样。即使是Webkit，也有多个JS引擎，例如V8和SquirrelFish，我不可能每个js引擎都实现一遍。但浏览器主要由两种插件体系：NPAPI（chrome里面加入了Pepper Plugin API ）和ActiveX，一个体系下插件的接口是一致的，因此使用插件方式只需要编写两种方式的注入，有了Firebreath之后更简单，只需要实现一致方式的注入就可以在各个浏览器上跑了。下面是在chrome里面跑pc套件的截图：

图上的url（http://moyang.org/pcwidget/widgets/application/com.kortide.app.pcSuite/jdy.html ）里面运行的是一个测试版，还有一些缺点（例如图片没有按需加载，第一次使用需要等待图片加载完）。IE里面排版还有点问题（万恶的CSS浏览器兼容），推荐在chrome或firefox里面运行。有android手机的可以试试，好久没弄这个了，跑不起来我可不负责^_^。

虽然插件是一种比较方便的方式，但在手机上通过插件来扩展并不是一种好的方式，而且插件在效率上确实有点损耗，所以应该尽量在浏览器外壳或js引擎里面注入，这样Webapp运行起来才有好的用户体验。插件将各个js引擎的API进行了统一，有优点也有缺点，属于一种穷人的解决方案。

好了，闲话讲完了，后面将接着介绍如何通过Firebreath写插件。

使用FireBreath写浏览器插件（二）相关推荐

使用FireBreath写浏览器插件（一）
一. FireBreath介绍 FireBreath是一个跨平台和跨浏览器的插件开发框架,通过Firebreath写的插件可以运行在windows,linux和mac上的IE,Firefox,Chro ...
使用FireBreath写浏览器插件（三）
三. FireBreath Helloworld 首先需要创建一个自己插件的工程,首先要安装Python,然后进入命令行后,在Firebreath的源代码目录下执行:python fbgen.py,这 ...
mac 下基于firebreath 开发多浏览器支持的浏览器插件
mac 下基于firebreath 开发多浏览器支持的浏览器插件首先要区分什么是浏览器扩展和浏览器插件;插件可以像本地程序一样做的更多一. 关于 firebreath http://www.fir ...
浏览器插件之ActiveX开发（二
浏览器插件之ActiveX开发(二) 按照上文<浏览器插件之ActiveX开发(一)>的步骤,能开发一个基于MFC的简单的ActiveX控件.不过在实际操作中还是会遇到一些问题.由于对CO ...
SketchUp的二次开发探索（二）菜单栏中放入自己写的插件
在初识 SketchUp 的 Ruby Code Editor之后, 我们学会了6行代码绘制球体. 但是这不是一个完整的插件, 在使用的时候还需要打开 Ruby Code Editor, 粘贴我们 ...
python写chrome插件_用VueJS写一个Chrome浏览器插件
浏览器基本已经天下大统了,放眼望去都是Chromium的天下.那么,能写一个浏览器插件也算是一种回报率不错的技能. 基本知识浏览器插件官方的说法叫扩展程序,允许你为浏览器增加各种功能,但不需要深入研 ...
使用chatgpt写一个划词翻译的浏览器插件
最近在网上流行的chatgpt,实在是太火了,好多人在使用,而且它的用处实在是太丰富了,能帮助我们解决很多问题,就比如说:编程,生成图片,翻译等.太丰富了.我看网上很多人都在说,它可以帮助人开发软件, ...
h5开发必备工具之草料二维码浏览器插件
h5开发必备工具之草料二维码浏览器插件做h5开发,的一个重点是如何适配手机,那么如何让你敲的代码可以在你手机上简单看到呢. 原理很简单,就是将你的电脑变成服务器,发射wifi给手机进行连接.然后在你 ...
Chrome 插件：自己写的插件提示请停用以开发者模式运行的插件处理方法，该拓展程序未列在chrome网上应用商店中，并可能是在您不知情的情况下添加的解决办法
Chrome 浏览器插件问题处理第一章:问题描述 ① 问题一:请停用以开发者模式运行的插件 ② 问题二:该拓展程序未列在 chrome 网上应用商店中,并可能是在您不知情的情况下添加的第二章:Ch ...

使用FireBreath写浏览器插件（二）

使用FireBreath写浏览器插件（二）相关推荐

最新文章

热门文章