How to write a webkit application where a javascript will invoke a QT C++ methods?

**joshis1** · 9th February 2014, 08:08

I am looking for a short example with a minute details covered.

I am writing a QT application - console one on the QT creator on FC19 machine. The aim here is to call a QT method from a javascript.

At the moment, I am following this link -

http://qt.developpez.com/doc/4.7/qtwebkit-bridge/

Iam facing two problems -

First compilation -

/home/joshis1/Demo_JS/main.cpp:2: error: QWebElement: No such file or directory

Qt Code:

Switch view

#include <QWebElement>
 
#include <QCoreApplication>
#include <QWebElement>
 
class MyObject : QObject {
        Q_OBJECT
 
    public slots:
        void doSomethingWithWebElement(const QWebElement&);
    };
 
    /* ... */
 
 
int main(int argc, char *argv[])
{
    QCoreApplication a(argc, argv);
 
    MyObject myObject;
    myWebPage.mainFrame()->addToJavaScriptWindowObject("myObject", &myObject);
 
 
    return a.exec();
}

#include <QWebElement>

#include <QCoreApplication>
#include <QWebElement>

class MyObject : QObject {
        Q_OBJECT

    public slots:
        void doSomethingWithWebElement(const QWebElement&);
    };

    /* ... */


int main(int argc, char *argv[])
{
    QCoreApplication a(argc, argv);

    MyObject myObject;
    myWebPage.mainFrame()->addToJavaScriptWindowObject("myObject", &myObject);


    return a.exec();
}

To copy to clipboard, switch view to plain text mode

Here is the pro file.

Qt Code:

Switch view

#-------------------------------------------------
#
# Project created by QtCreator 2014-02-08T17:31:01
#
#-------------------------------------------------
 
QT       += core
 
QT       -= gui
 
TARGET = Demo_JS
CONFIG   += console
CONFIG   -= app_bundle
QT += webkit
 
TEMPLATE = app
 
 
SOURCES += main.cpp

#-------------------------------------------------
#
# Project created by QtCreator 2014-02-08T17:31:01
#
#-------------------------------------------------

QT       += core

QT       -= gui

TARGET = Demo_JS
CONFIG   += console
CONFIG   -= app_bundle
QT += webkit

TEMPLATE = app


SOURCES += main.cpp

To copy to clipboard, switch view to plain text mode

The next upcoming challenge I thinks is how to relate a java script present in any folder of my FC19 to invoke a QT function defined in the above program. How my javascript will know the path to pick the application. How it can be done? This is my java script wrapped in a html file.

Qt Code:

Switch view

<html>
      <head>
          <script>
              function runExample() {
                 myObject.doSomethingWithWebElement(document.getElementById("someElement"));
              }
         </script>
      </head>
      <body onload="runExample()">
          <span id="someElement">Text</span>
      </body>
  </html>

<html>
      <head>
          <script>
              function runExample() {
                 myObject.doSomethingWithWebElement(document.getElementById("someElement"));
              }
         </script>
      </head>
      <body onload="runExample()">
          <span id="someElement">Text</span>
      </body>
  </html>

To copy to clipboard, switch view to plain text mode

Please help me here with an elaborate explanation. I am literally frustrated with all my trials.