javascript - 如何使用 QJSEngine 构建 API？

Question

我从 Qt 开始，我的一个项目正在使用 QJSEngine 来评估 javascript，我想为脚本提供一个完整的 API，包括类和全局函数。

现在我的程序只提供 ECMAScript 默认的东西(eval、encodeURI、parseInt 等)，但我需要向代码公开一些自定义类，比如浏览器 API(WebSocket 类、Image 类、文档目的)。例如:

var obj = new CustomClass("", 0);
var ret = obj.customClassMethod("[...]!");
customFunction(ret);

我需要在 C++ 中定义类的行为，这无助于评估类定义并让用户代码运行。

Answer 1

与 QScriptEngine 相比，如果自定义类继承自 QObject，您可以使用 Q_SCRIPT_DECLARE_QMETAOBJECT 添加自定义类宏，QJSEngine 不直接提供此功能。

您仍然可以使用Qt 元对象系统为Javascript 提供接口(interface)，但您必须在C++ 中实例化对象并将其添加到Javascript 上下文中。然后它的插槽、用 Q_INVOKABLE 定义的方法和用 Q_PROPERTY 定义的属性都可以从 Javascript 运行时中访问。

现在您可以创建一个工厂，它为包装为 Javascript 对象的给定 QJSEngine 创建自定义类 CustomClass 的实例:

class CustomClassFactory : public QObject
{
    Q_OBJECT
public:
  CustomClassFactory(QJSEngine* engine) : m_engine(engine) {}
  Q_INVOKABLE QJSValue createInstance() {
      // The engine takes ownership and destroys the object if no longer required.
      return m_engine->newQObject(new CustomClass());
  }
private:
    QJSEngine* m_engine;
}

需要构造一个工厂实例并将其添加到 Javascript 运行时的全局对象中:

QJSEngine engine;
QJSValue factoryObj = engine.newQObject(new CustomClassFactory());
engine.globalObject().setProperty("_customClassFactory", factoryObj);

现在我们可以用 Javascript 构造对象:

var obj = _customClassFactory.createInstance()

既然我们已经走到这一步，让我们为自定义类额外注入(inject)一个构造函数到 Javascript 运行时:

QJSEngine engine;
// Again, the QJSEngine will take ownership of the created object.
QJSValue factoryObj = engine.newQObject(new CustomClassFactory());
engine.globalObject().setProperty("_customClassFactory", factoryObj);
engine.evaluate(
    "function CustomClass() {"
    "    return _customClassFactory.createInstance()"
    "}");

Et voilà，现在您可以在 Javascript 中构造 C++ 对象，就像自定义 Javascript 类一样:

var obj = new CustomClass()

对于提到的 WebSocket API，您可以为此包装 QtWebSocket - 这正是我在提出建议的方法时所需要的。

请注意，为了简单起见，我省略了构造函数的参数，但也可以简单地添加它们。

PS:我会添加更多指向官方文档的链接，但由于缺乏声誉，我不允许这样做。