webview - वेबदृश्य जावास्क्रिप्ट से सी++ विधि को खोलें

qml qtwebkit (2)

Qt4 qml में qtwebkit 1.0 घटक वेबदृश्य में एक संपत्ति javaScriptWindowObjects । मैंने इसे javascriptWindowObjects को मेरे वेबपेज जावास्क्रिप्ट को संदर्भित करने के लिए c ++ फ़ंक्शन कॉल करने के लिए उपयोग किया था। इस तरह

    url: "http://test.com"
    anchors.fill: parent
    scale: 1.0

    javaScriptWindowObjects: QtObject {
        WebView.windowObjectName: "native"

        function foo(x, y) {
             console.log("This is a call from javascript");

इसलिए मैं इसे वेबपेज जावास्क्रिप्ट से ऐसा कॉल कर सकता हूं

<script type="text/javascript">

लेकिन qt5 qml qtwebkit 3.0 में ऐसी कोई चीज नहीं है जैसे javascriptWindowObjects

मैं इसे QT5 qml में कैसे प्राप्त कर सकता हूं?

बस रिकॉर्ड के लिए यह किया पाने के लिए:

import QtQuick 2.0
import QtWebKit 3.0
import QtWebKit.experimental 1.0

Rectangle {

   width: 1024
   height: 768

       url: "http://localhost"
       anchors.fill: parent

       experimental.preferences.navigatorQtObjectEnabled: true
       experimental.onMessageReceived: {

           console.debug("get msg from javascript")
   } // webview
} // rectanlge

<h1>It just works!</h1>

<p>Play with me...</p>

<button onclick="nativecall();">test</button>
<div id="out"></div>

<script type="text/javascript">
    function nativecall(){
        console.log("will try native call");
        var elem = document.getElementById("out").innerHTML="clicked";
        navigator.qt.postMessage('this is a js call');

    function jsCall(message){
        var elem = document.getElementById("out").innerHTML="and the other way around " + message;

    navigator.qt.onmessage = function(ev) {


Qt 5.8.0 QML और जावास्क्रिप्ट बंधन

QML कोड

import QtQuick 2.0
import QtWebEngine 1.4
import QtWebChannel  1.0

    height: 500
    width:  500

// Create WebChannel

//Now, let’s create an object that we want to publish to the HTML/JavaScript clients:
QtObject {
    id: myObject
    objectName: "myObject"

    // the identifier under which this object
    // will be known on the JavaScript side
    //WebChannel.id: "webChannel"

    property var send: function (arg) {

    // signals, methods and properties are
    // accessible to JavaScript code
    signal someSignal(string message);

    function someMethod(message) {
        return dataManager.getGeoLat();

    property string hello: "world";

    anchors.fill: parent
    color: "black"

    id : webEnginView
    anchors.fill: parent
    url : dataManager.htmlURL();
    webChannel: webChannel

Component.onCompleted: {
    webChannel.registerObject("foo", myObject);

HTML कोड

<script type="text/javascript" src="qrc:/Map/qwebchannel.js"></script>
<script type="text/javascript">
new QWebChannel(qt.webChannelTransport, function(channel) {
    // all published objects are available in channel.objects under
    // the identifier set in their attached WebChannel.id property
    var foo = channel.objects.foo;

    // access a property

    // connect to a signal
    foo.someSignal.connect(function(message) {
        alert("Got signal: " + message);

    // invoke a method, and receive the return value asynchronously
       foo.someMethod("bar", function(ret) {
       alert("Got return value: " + ret);