cocos2d-js 3.0 RC0 手动绑定 C++调用js，js调用C++ jsbinding

参考 http://www.cnblogs.com/kenkofox/p/3910462.html
参考 http://www.tairan.com/archives/4902
参考 http://cn.cocos2d-x.org/tutorial/show?id=1317
-----------------------------------------------------------------------------------------------------

iOS/Mac中使用JS调用Objective-C函数

pandamicro2014-08-12 19:33:131290 次阅读

在Cocos2d-JS v3.0 RC2中，我们将介绍JS到Objective-C的反射特性。这就像在Java中我们可以使用JS调用Java本地函数一样，你也可以使用JS调用Objective-C的静态方法。

可以通过传递className methodName 和 parmeters来使用jsb.reflection.callStaticMethod调用本地的OC方法。

Objective-C中的类

你需要像下面的例子一样，在OC的类中提供你的方法。下例中参数className应该是NativeOcClass。

Objective-C中的方法

JS到OC的反射只支持OC类中的静态方法。

在之前的例子中，methodName 参数是类的OC方法名，如我们将一个方法命名为NativeOcClass。

因此，这个methodName应该由callNativeUIWithTitle:addContent: 来定义（注意不要忘记"："）。更多详情请查看Objective-C编程指南。

在下面的例子中，methodName应该为callNativeWithReturnString。

用法

在JS代码中，可使用如下的jsb.reflection.callStaticMethod API来调用NativeOcClass的本地方法callNativeUIWithTitle:andContent:：

此方法将会显示一个警告框，并返回一个布尔类状态。下面是它的实现方法，title和content参数将会接收从JS中传来的字符串。

注意事项

在Cocos2d-JS反射中，支持的参数类型以及返回值是受限制的。

如果需要在本地方法中使用float、int、和double类型的参数，那么你需要使用NSNumber替代。

如果需要使用bool类型的参数，那么用BOOL替代。

下面有个例子，使用NSNumber代替int, float以及double。

当前版本仅支持int,float, bool和string的返回值类型。

如何实现c++中调用js呢，参照一下文章，

测试了下，如果是单独从c++调用js的话

<strong>jsval ret;
ScriptingCore::getInstance()->evalString("cpp_callback(2,3)", &ret); </strong>

第一个参数是声明函数，全局函数。 也可以是类静态函数: MyClass.method(1,2).

# import "cocosbuilder/js_bindings_ccbreader.h"



上面的js调cpp应该是封装过了，如果自己实现的话要参照下面, 注册函数等。这样才可以在js中直接调用

--------------------------------------------------------------------------------------------------------------------------------------------------------------

1 JS调用C++

3.0中写这个绑定比较简单，跟ANE调用java如出一辙，一个JSContext，一个jsval，使用cocos2d提供的c++和js变量转换的函数做好转换即可。

cocos2d-js原来就定义好了代码风格：

sc->addRegisterCallback(MinXmlHttpRequest::_js_register);
sc->addRegisterCallback(register_jsb_websocket);
sc->addRegisterCallback(register_jsb_socketio);

#if (CC_TARGET_PLATFORM == CC_PLATFORM_ANDROID)
sc->addRegisterCallback(JavascriptJavaBridge::_js_register);
#endif

sc->addRegisterCallback(register_jsb_kenko_all);

sc->start();

我们也顺着这个风格，添加一个函数：register_jsb_kenko_all，这是一个全局函数。

jsb_kenko_auto.h

#ifndef jsb_jsb_kenko_auto_h
#define jsb_jsb_kenko_auto_h

#include "cocos2d.h"

std::string os_info();
bool jsb_os_info(JSContext *cx, uint32_t argc, JS::Value *vp);
bool jsb_callback(JSContext *cx, uint32_t argc, JS::Value *vp);
void register_jsb_kenko_all(JSContext* cx, JSObject* obj);

#endif

jsb_kenko_auto.cpp

#include "jsb_kenko_auto.h"
#include "cocos2d_specifics.hpp"

std::string os_info() {
CCLOG("it's c++ os_info here");
return "os_info";
}

bool jsb_os_info(JSContext *cx, uint32_t argc, JS::Value *vp) {
jsval ret = std_string_to_jsval(cx, os_info());
JS_SET_RVAL(cx, vp, ret);

return true;
}

void register_jsb_kenko_all(JSContext *cx, JSObject *obj) {
JS_DefineFunction(cx, obj, "osInfo", jsb_os_info, 0, 0);  //生成名为osInfo的js全局函数

}

把h和cpp文件都放到AppDelegate.cpp同一个地方。上述的c++代码会在spidermonkey运行环境中生成相应的js接口，所以，我们不需要自己额外写对应的js接口。

然后就可以写js代码试试了。从运行结果可以看到，js调用成功，并获取到返回值。

cc.game.onStart = function(){
cc.view.setDesignResolutionSize(800, 450, cc.ResolutionPolicy.SHOW_ALL);
cc.view.resizeWithBrowserSize(true);
cc.director.runScene(new MainScene());

cc.log("js get from c++: " + osInfo());
};
cc.game.run();

2 C++回调

关键在于使用ScriptingCore提供的方法，调用js。首先来看看ScriptingCore的源代码，都有些什么方法可以用。

executeFunctionWithOwner可以实现类似cc.sprite之类的c++对象和js对象的调用，没有深究。这里演示的是如何做全局调用。

evalString对任何一个前端开发来说都不会太陌生，毕竟这里不是浏览器，排除各种乱七八糟的安全问题，我们直接用这个函数。

/**
@brief Execute a scripted global function.
@brief The function should not take any parameters and should return an integer.
@param functionName String object holding the name of the function, in the global script environment, that is to be executed.
@return The integer value returned from the script function.
*/
virtual int executeGlobalFunction(const char* functionName) { return 0; }

virtual int sendEvent(cocos2d::ScriptEvent* message) override;

virtual bool parseConfig(ConfigType type, const std::string& str) override;

virtual bool handleAssert(const char *msg) { return false; }

virtual void setCalledFromScript(bool callFromScript) { _callFromScript = callFromScript; };
virtual bool isCalledFromScript() { return _callFromScript; };

bool executeFunctionWithObjectData(void* nativeObj, const char *name, JSObject *obj);
bool executeFunctionWithOwner(jsval owner, const char *name, uint32_t argc = 0, jsval* vp = NULL, jsval* retVal = NULL);

void executeJSFunctionWithThisObj(jsval thisObj, jsval callback, uint32_t argc = 0, jsval* vp = NULL, jsval* retVal = NULL);

/**
* will eval the specified string
* @param string The string with the javascript code to be evaluated
* @param outVal The jsval that will hold the return value of the evaluation.
* Can be NULL.
*/
bool evalString(const char *string, jsval *outVal, const char *filename = NULL, JSContext* cx = NULL, JSObject* global = NULL);

修改jsb_kenko_auto.cpp：

#include "jsb_kenko_auto.h"
#include "cocos2d_specifics.hpp"

std::string os_info() {
CCLOG("it's c++ os_info here");
return "os_info";
}

bool jsb_callback(JSContext *cx, uint32_t argc, JS::Value *vp) {
CCLOG("it's c++ testCallback here");
JSContext* jc = ScriptingCore::getInstance()->getGlobalContext();
// 注释部分适合有对象化的调用
// 参考：http://www.tairan.com/archives/4902
//jsval v[2];
//v[0] = int32_to_jsval(jc, 32);
//v[1] = int32_to_jsval(jc, 12);

// 通过 ScriptingCore 封装好的方法实现回调，可以帮助我们节省很多细节上的研究
//js_proxy_t * p = jsb_get_native_proxy();
//return ScriptingCore::getInstance()->executeFunctionWithOwner(OBJECT_TO_JSVAL(p->obj), "cpp_callback", 2, v);        //2是参数个数，v是参数列表

//找到一个更适合全局函数的方法
jsval ret;
return ScriptingCore::getInstance()->evalString("cpp_callback(2,3)", &ret);
}

bool jsb_os_info(JSContext *cx, uint32_t argc, JS::Value *vp) {
jsval ret = std_string_to_jsval(cx, os_info());
JS_SET_RVAL(cx, vp, ret);

return true;
}

void register_jsb_kenko_all(JSContext *cx, JSObject *obj) {
JS_DefineFunction(cx, obj, "osInfo", jsb_os_info, 0, 0);
JS_DefineFunction(cx, obj, "test_cpp_callback", jsb_callback, 0, 0);
}

相应在js侧添加一个全局函数，给c++调用。

cc.game.onStart = function(){
cc.view.setDesignResolutionSize(800, 450, cc.ResolutionPolicy.SHOW_ALL);
cc.view.resizeWithBrowserSize(true);
cc.director.runScene(new MainScene());

cc.log("js get from c++: " + osInfo());
test_cpp_callback();
};
cc.game.run();

function cpp_callback(a, b) {
cc.log("cpp return two integer: " + a + " " + b);
}

看输出结果：

　　


3 各种变量转换函数

都在js_manual_conversions.h这里了，真是应有尽有。下边只列出一部分。

bool jsval_to_ushort( JSContext *cx, jsval vp, unsigned short *ret );
bool jsval_to_int32( JSContext *cx, jsval vp, int32_t *ret );
bool jsval_to_uint32( JSContext *cx, jsval vp, uint32_t *ret );
bool jsval_to_uint16( JSContext *cx, jsval vp, uint16_t *ret );
bool jsval_to_long( JSContext *cx, jsval vp, long *out);
bool jsval_to_ulong( JSContext *cx, jsval vp, unsigned long *out);
bool jsval_to_long_long(JSContext *cx, jsval v, long long* ret);
bool jsval_to_std_string(JSContext *cx, jsval v, std::string* ret);

jsval int32_to_jsval( JSContext *cx, int32_t l);
jsval uint32_to_jsval( JSContext *cx, uint32_t number );
jsval ushort_to_jsval( JSContext *cx, unsigned short number );
jsval long_to_jsval( JSContext *cx, long number );
jsval ulong_to_jsval(JSContext* cx, unsigned long v);
jsval long_long_to_jsval(JSContext* cx, long long v);
jsval std_string_to_jsval(JSContext* cx, const std::string& v);

----------------------------http://www.tairan.com/archives/4902------------------------------------------------------------------------------------------------------------------------------------

Cocos2d-x Js Binding 的手动绑定实现

A-A+
一叶2013 年 8 月 13 日13条评论
238 次浏览
Cocos2d-x
cocos2d-x

文章目录

JSB 手动绑定的实现步骤
怎样实现 C++ 回调 JS
JSB 的内存管理

随着 Cocos2d-x 的发展，Cocos2d-html5 也日益完善，相比纯 C++ 的开发方式，它开发效率更为高效，而另一个显而易见的好处便是 JS 端的 API 可以作为 Cocos2d-x Javascript Bindings (JSB) 的接口封装。一套 API，两种解决方案，这让用 JS 快速开发游戏，通过 JSB 以接近原生代码的速度来运行游戏成为可能。

这里使用当前稳定版 Cocos2d-x-2.1.4，Xcode JSB 项目模板创建项目，如果是用其它 IDE ，注意配置好不同环境的依赖关系，本文的示例源码可以在 【这里】 看到。

JSB 手动绑定的实现步骤

要实现 C++ 到 JS 的手动绑定，首先我们需要定义一个待绑定的类，为了这里的解说简单，创建了一个非常简单的类，也只定义了些简单的方法，如下：

// Leafsoar.h 文件定义
namespace ls {
class Leafsoar: public cocos2d::CCObject
{
public:
static cocos2d::CCScene* scene();
virtual bool init();
CREATE_FUNC(Leafsoar);
void functionTest();
};
}

// Leafsoar.cpp 实现
bool ls::Leafsoar::init(){
bool bRef = false;
do {
cocos2d::CCLog("leafsoar init ...");
bRef = true;
} while (0);
return bRef;
}
void ls::Leafsoar::functionTest(){
cocos2d::CCLog("function Test");
}

以上是我们定义的一个类，在 ls 命名空间里面，它很简单，继承自 CCObject，定义实现了 functionTest 方法，我们下面要做的就是将它绑定到 JS ，最终达到通过 JS 来创建对象，并且调用方法。如果不知道从何下手，那么下面是一种实现思路。

为了使代码风格统一 （这样的好处是任何人都能相对容易的读懂代码并修改之），我们将参照 Cocos2d-x 现有的 JSB 实现，如从 AppDelegate 的 applicationDidFinishLaunching 方法开始，里面实现了 JSB 环境的初始化等操作，其中我们看到类似

sc->addRegisterCallback(register_all_cocos2dx);

这样的代码，而我们将创建 register_all_ls 方法，来完成我们自有 ls 命名空间下需要绑定的代码。

编写 jsb_ls_auto.h 文件，定义如下：

#include "jsapi.h"
#include "jsfriendapi.h"
#include "ScriptingCore.h"

void register_all_ls(JSContext* cx, JSObject* obj);

完成了以上 register_all_ls 方法定义，它作为自定义 JSB 手动绑定函数的入口，内中实现绑定我么的命名空间，我们的类和方法等 ~ 所以 js_ls_auto.cpp 的实现需要根据自己的需要实现，以下是当前的实现步骤，：

#include "jsb_ls_auto.h"
#include "cocos2d.h"
#include "Leafsoar.h"

#include "cocos2d_specifics.hpp"

// 定义 js 端的类型
JSClass  *jsb_LsLeafsoar_class;
JSObject *jsb_LsLeafsoar_prototype;

// 实现 ls 命名空间下的类绑定
void register_all_ls(JSContext* cx, JSObject* obj) {
jsval nsval;
JSObject *ns;
JS_GetProperty(cx, obj, "ls", &nsval);
if (nsval == JSVAL_VOID) {
ns = JS_NewObject(cx, NULL, NULL, NULL);
nsval = OBJECT_TO_JSVAL(ns);
JS_SetProperty(cx, obj, "ls", &nsval);
} else {
JS_ValueToObject(cx, nsval, &ns);
}
obj = ns;

// 实现绑定 Leafsoar 类，它的定义后文给出
js_register_ls_Leafsoar(cx, obj);
}

为了实现思路的清晰，所以文章内容以 register_all_ls 为入口，一步步实现，需要什么，我们就去实现什么，看到上面绑定了命名空间（在 js 中并没有明确的命名空间的机制，但 js 能实现类似命名空间的效果），并调用了js_register_ls_Leafsoar(cx, obj); 方法来实现具体的绑定，下面是它的实现：

// 绑定 Leafsoar 类的实现
void js_register_ls_Leafsoar(JSContext *cx, JSObject *global) {
// 创建一个 JS 类型的对象
jsb_LsLeafsoar_class = (JSClass *)calloc(1, sizeof(JSClass));
// 类型名称为 **Leafsoar** 正式绑定到 js 由 js 调用的名称
jsb_LsLeafsoar_class->name = "Leafsoar";
jsb_LsLeafsoar_class->addProperty = JS_PropertyStub;
jsb_LsLeafsoar_class->delProperty = JS_PropertyStub;
jsb_LsLeafsoar_class->getProperty = JS_PropertyStub;
jsb_LsLeafsoar_class->setProperty = JS_StrictPropertyStub;
jsb_LsLeafsoar_class->enumerate = JS_EnumerateStub;
jsb_LsLeafsoar_class->resolve = JS_ResolveStub;
jsb_LsLeafsoar_class->convert = JS_ConvertStub;
// Leafsoar 类型的析构函数绑定
jsb_LsLeafsoar_class->finalize = js_ls_Leafsoar_finalize;
jsb_LsLeafsoar_class->flags = JSCLASS_HAS_RESERVED_SLOTS(2);

static JSPropertySpec properties[] = {
{0, 0, 0, JSOP_NULLWRAPPER, JSOP_NULLWRAPPER}
};

// 为 Leafsoar 设定绑定函数，函数名 "functionTest"，绑定函数 "js_ls_Leafsoar_functionTest"
// 后面可以添加其它函数绑定，如果需要，之后以 "JS_FS_END" 结尾
static JSFunctionSpec funcs[] = {
JS_FN("functionTest", js_ls_Leafsoar_functionTest, 1, JSPROP_PERMANENT | JSPROP_ENUMERATE),
JS_FS_END
};

// 这里定义并且绑定了静态函数(static)，包括方法名 "create" 和对应的绑定实现 "js_ls_Leafsoar_create"
static JSFunctionSpec st_funcs[] = {
JS_FN("create", js_ls_Leafsoar_create, 0, JSPROP_PERMANENT | JSPROP_ENUMERATE),
JS_FS_END
};

// 初始化类型属性
jsb_LsLeafsoar_prototype = JS_InitClass(
cx, global,
NULL, // parent proto
jsb_LsLeafsoar_class,
js_ls_Leafsoar_constructor, 0, // 这里绑定的是构造函数的实现，也就是用 js new 操作符创建的对象
properties,
funcs,      // 函数绑定
NULL, // no static properties
st_funcs);      // 静态函数绑定

JSBool found;
JS_SetPropertyAttributes(cx, global, "Leafsoar", JSPROP_ENUMERATE | JSPROP_READONLY, &found);

TypeTest<ls::Leafsoar> t;
js_type_class_t *p;
uint32_t typeId = t.s_id();
HASH_FIND_INT(_js_global_type_ht, &typeId, p);
if (!p) {
p = (js_type_class_t *)malloc(sizeof(js_type_class_t));
p->type = typeId;
p->jsclass = jsb_LsLeafsoar_class;
p->proto = jsb_LsLeafsoar_prototype;
p->parentProto = NULL;
HASH_ADD_INT(_js_global_type_ht, type, p);
}
}

写到这里，类型的绑定已经基本完成，但是可以看见，其中所用到的如 js_ls_Leafsoar_functionTest、js_ls_Leafsoar_finalize 、js_ls_Leafsoar_create 和 js_ls_Leafsoar_constructor 并没有实现，它们是在绑定 Leafosar 类型的时候去绑定了，所以需要在调用前去实现它们，下面是它们的实现：

// js 端 functionTest 所绑定的方法调用
JSBool js_ls_Leafsoar_functionTest(JSContext *cx, uint32_t argc, jsval *vp)
{
JSBool ok = JS_TRUE;

JSObject *obj = NULL;
ls::Leafsoar* cobj = NULL;  // 定义以获取真实类型
obj = JS_THIS_OBJECT(cx, vp);
js_proxy_t *proxy = jsb_get_js_proxy(obj);
// 获取 js 绑定的实际对象 通过 proxy->ptr
cobj = (ls::Leafsoar *)(proxy ? proxy->ptr : NULL);
JSB_PRECONDITION2( cobj, cx, JS_FALSE, "Invalid Native Object");
if (argc == 0) {
// 调用实际的方法
cobj->functionTest();
JS_SET_RVAL(cx, vp, JSVAL_VOID);
return ok;
}

JS_ReportError(cx, "wrong number of arguments");
return JS_FALSE;
}

// js 构造函数实现
JSBool js_ls_Leafsoar_constructor(JSContext *cx, uint32_t argc, jsval *vp)
{
cocos2d::CCLog("js ls lsleafsoar constructor ..");
if (argc == 0) {
// 调用 C++ 构造函数
ls::Leafsoar* cobj = new ls::Leafsoar();
cocos2d::CCObject* _ccobj = dynamic_cast<cocos2d::CCObject*>(cobj);
// 默认使用原有的内存管理方式
if (_ccobj){
_ccobj->autorelease();
}
TypeTest<ls::Leafsoar> t;
js_type_class_t *typeClass;
uint32_t typeId = t.s_id();
HASH_FIND_INT(_js_global_type_ht, &typeId, typeClass);
assert(typeClass);
JSObject *obj = JS_NewObject(cx, typeClass->jsclass, typeClass->proto, typeClass->parentProto);
JS_SET_RVAL(cx, vp, OBJECT_TO_JSVAL(obj));
// 构造 js 端对象，将 cobj 实际对象存入
js_proxy_t* p = jsb_new_proxy(cobj, obj);
JS_AddNamedObjectRoot(cx, &p->obj, "ls::Leafsoar");

return JS_TRUE;
}

JS_ReportError(cx, "wrong number of arguments: %d, was expecting %d", argc, 0);
return JS_FALSE;
}

// 静态函数 create 的具体实现
JSBool js_ls_Leafsoar_create(JSContext *cx, uint32_t argc, jsval *vp)
{
cocos2d::CCLog("js ls lsleafsoar create ..");
if (argc == 0) {
// 创建 Leafsoar 对象
ls::Leafsoar* ret = ls::Leafsoar::create();
jsval jsret;
do {
if (ret) {
js_proxy_t *proxy = js_get_or_create_proxy<ls::Leafsoar>(cx, ret);
jsret = OBJECT_TO_JSVAL(proxy->obj);
} else {
jsret = JSVAL_NULL;
}
} while (0);
JS_SET_RVAL(cx, vp, jsret);
return JS_TRUE;
}
JS_ReportError(cx, "wrong number of arguments");
return JS_FALSE;
}

void js_ls_Leafsoar_finalize(JSFreeOp *fop, JSObject *obj) {
// 析构函数实现，如果在构造函数做了什么，如开辟内存空间，那么需要在这里做些收尾工作
//    CCLOGINFO("jsbindings: finalizing JS object %p (LsLeafsoar)", obj);
}

通过以上的步骤，我们实现了 C++ 类 Leafosar 到 JS 端的绑定。在 JS 中我们可以通过以下调试测试：

// var ls = new ls.Leafsoar();
// 或者
var ls = ls.Leafsoar.create();
// 之后调用
ls.functionTest();

怎样实现 C++ 回调 JS

在上文，完成了 C++ 到 js 的手动绑定，但有时我们还需要其它一些功能，比如想在 C++ 开一个多线程以加载资源，或者一个网络异步请求，再如要实现一个 delegate 以实现接口回调，然这些都归为同一个问题，实现 C++ 到 js 的回调。我们在 js 端定义了一个 Leafsoar 对象，并且新实现了一个方法，等待 C++ 端的回调，如下：

var ls = new ls.Leafsoar(); // 创建一个对象
// 定义回调函数 callback
ls.callback = function(i, j){
log("ls.callback " + i + j);
};
ls.functionTest();

我们想通过调用 functionTest 之后回调在 js 端定义的 callback 方法。那么我们需要重新实现 C++ 端的 functionTest 方法：

void ls::Leafsoar::functionTest(){
cocos2d::CCLog("function Test");
js_proxy_t * p = jsb_get_native_proxy(this);
jsval retval;
JSContext* jc = ScriptingCore::getInstance()->getGlobalContext();
//  定义参数，由两个参数
jsval v[] = {
v[0] = int32_to_jsval(jc, 32),
v[1] =UINT_TO_JSVAL(88)
};
// 通过 ScriptingCore 封装好的方法实现回调，可以帮助我们节省很多细节上的研究
ScriptingCore::getInstance()->executeFunctionWithOwner(OBJECT_TO_JSVAL(p->obj), "callback", 2, v, &retval);
}

JSB 的内存管理

了解 Cocos2d-x 的朋友知道，它的内存管理方式，如果对此有疑问，可以参见 Cocos2d-x 内存管理浅说 和 深入理解 Cocos2d-x 内存管理 这两篇文章，那么在 JSB 我们如何来管理内存呢？在
C++ 需要通过 retain 和 release 来实现引用计数的管理（源码示例也给出它的绑定实现，但仅仅作为参考），在绑定 js 时，如果不做相应处理，那么可能会出现 js 正在运行着的代码，所绑定的实际 C++ 对象已经释放。虽然我们能通过 绑定实现 retain 和 release 方法，来实现 js 端的此方法调用，但这显然不符合 js 代码边的习惯，它是自动回收的，所以这里推荐 始终 由 SpiderMonkey
来保持一份对象引用，以使它更像 JS 的使用方式，当 js 垃圾回收自动执行时，在去释放 SpiderMonkey 对对象的引用。

要做到这一点，我们需要只要修改上文的代码实现，在 构造函数，create 静态方法，实现对 C++ 类型对象的引用，在 析构绑定的析构函数中解除对其的引用以完成 C++ 到 JS 端绑定的内存管理方案。