C++/JS混合开发

1.JS

    上面是一个很简单的网页，body里面就一个canvas标签，canvans里面展示C++传递过来的图片数据。

   下面的匿名函数用来注册C++的回调，注册完成后发送消息给C++。

onInvokeQtFunction('registerFinished', '{"type":"faceRegister"}');就是调用C++的registerFinished方法并传递一个json格式的参数

 

2.C++

void WebView::runJavaScript(const QString &data)
{
    QCefEvent event;
    event.setStringProperty("type", "function");
    event.setStringProperty("data", data);
    broadcastEvent("invokeJsFunction", event);
}

void WebView::onInvokeMethodNotify(int browserId, int frameId, const QString method, const QVariantList arguments)
{
    qDebug() << "onInvokeMethodNotify: " << browserId << frameId;
    qDebug() << "method: " << method;
    qDebug() << "arguments:";
 
   for (int i = 0; i < arguments.size(); ++i) {
        qDebug() << arguments.at(i).toString();
    }
 
    QString args;
 
    if (!arguments.isEmpty()) {
        args = arguments.first().toString();
    }
 
    emit invokeQtFunction(method, args);
}

 

C++这边实现runJavaScript来调用JS的方法，onInvokeMethodNotify来处理JS的回调。

 

runJsFunctions(QString("getImgData('%1')").arg(QString(bytes.toBase64())));

 这行代码就是给JS传递图片数据，使用这种方法还能传递很多其他数据。

 

参考：

https://www.yuque.com/docs/share/95798f1f-5405-4acc-b212-4790108ddd60