The Qt WebChannel module offers Qt applications a seamless way to publish QObjects for interaction
with HTML/JavaScript clients. These clients can either be inside local Qt WebViews or any other,
potentially remote, client which supports JavaScript, as long as a communication channel such
as WebSocket is available.
Qt WebChannel uses introspection on the QObjects and sends this serialized data to the clients.
There, with the help of a small JavaScript library, an object is created which simulates the API of
the QObject. Any invokable methods, including slots, can be called as well as properties read and
written. Additionally you can connect to signals and register JavaScript callbacks as handlers.
This module depends on Qt Core only. Optionally, an additional plugin for Qt Quick can be built, which
makes it easy to use a QWebChannel from QML. Note that this module alone is not functional. It
is being used in e.g. Qt WebKit to provide a seamless integration of QML/C++ QObjects into JavaScript
clients. You can integrate it in your projects as well, by providing an implementation of the
QWebChannelAbstractTransport class, see the standalone example for how to do this.
qmake-qt5
make
make install
To use the Qt/C++ library, add the following to your QMake project:
QT += webchannel
Then, in your C++ code, construct a webchannel, then publish your QObjects:
QWebChannel channel;
channel.registerObject(QStringLiteral("foo"), myFooObj);
....
Additionally, you need to provide a communication channel to the HTML client. One way is to
use the Qt WebSockets module. On the HTML/JavaScript client side, you need to embed
src/webchannel/qwebchannel.js and setup the connection to a client-side transport. An example
which shows all this in action can be found in examples/standalone.
For QML applications, use the following import:
import QtWebChannel 1.0
Then setup the WebChannel, register objects to it and connect to transport objects:
WebChannel {
registeredObjects: [foo, bar, ...]
transports: [yourTransport]
}
To see this in action, take a look at the test code in tests/auto/qml.