Important: Please read the Qt Code of Conduct -

How to call qml function from html side

  • Hi,
    I want to invoke form HTML a someFoo("someStr") function wich is located in QML as follows:


    import QtQuick 2.5
    import QtQuick.Window 2.2
    import QtWebEngine 1.0
    import QtWebChannel 1.0
    Window {
    visible: true
    width: 640
    height: 480
    QtObject {
        id: myQmlObj
        function someFoo(msg) {
    WebEngineView {
        id: view
        anchors.fill: parent
        url: "myHtml.html"
        WebChannel {
           id: webChannel
           registeredObjects: [myQmlObj]


    <script type="text/javascript" src="qrc:///qtwebchannel/qwebchannel.js"></script>
    <script type="text/javascript">
        new QWebChannel(qt.webChannelTransport, function (channel) {
            var myQmlObj = channel.objects.myQmlObj;

    .pro file includes

    QT += core gui network webenginewidgets webchannel

    but when I try it I get the following error:

    js: Uncaught ReferenceError: qt is not defined

    Does anybody have an idea what I am doing wrong ? I am using Qt 5.9

  • Hard to say, as you don't provide all the code. I have used webchannel with Qt 5.9 so know it works. Your code looks right
    Do you have a "import QtWebChannel" in your QML. How about moving the WebChangel declaration out of your WebEngineView
    and/or declaring it like this:

    WebChannel {
    registeredObjects: [mapController]

    WebEngineView {
    webChannel: wc

  • @bartalke
    One more thing , since our problem seems to be on the html side. Try removing the qrc: from the javascript.

Log in to reply