वेबव्यू से सी ++ विधि को आमंत्रित करें जावास्क्रिप्ट

qt4 qml में qtwebkit 1.0 घटक वेबव्यू में एक संपत्ति javaScriptWindowObjects है। मैंने इसे cp++ कार्यों को कॉल करने के लिए जावास्क्रिप्ट के वेबपृष्ठों के संदर्भ में javaScriptWindowObjects जोड़ने के लिए उपयोग किया। जैसे इतनावेबव्यू से सी ++ विधि को आमंत्रित करें जावास्क्रिप्ट

WebView{ 
    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"); 
      myCppHandler.fooNative(b,c); 
     } 
    } 
}

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

<script type="text/javascript"> 
    native.foo(1,2) 
</script>

लेकिन में तरह qt5 qml QtWebKit 3.0 है javaScriptWindowObjects

की तरह ऐसी कोई बात नहीं मैं कैसे प्राप्त कर सकते हैं कि में qt5 qml?

स्रोत

2013-01-15 dustin.b

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

import QtQuick 2.0 
import QtWebKit 3.0 
import QtWebKit.experimental 1.0 

Rectangle { 

    width: 1024 
    height: 768 

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

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

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


<html> 
<body> 
<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) { 
     jsCall(ev.data); 
    } 
</script> 

</body> 
</html>

स्रोत

2013-01-16 18:24:30

यह आकर्षक है, बी जैसा कि मैंने पाया कि प्रायोगिक मोड चालू करते समय भी, मुझे अतिरिक्त कार्यक्षमता मिली, फिर भी कुछ अजीब चीजें पृष्ठ नियंत्रणों के साथ हुईं। चेकबॉक्स और रेडियो बटन जीत गए, स्क्रॉलबार गायब हो गए (अगर मैंने उन्हें डीवीवी के साथ चालू किया), और चयन तत्व काम करना बंद कर दिया। यह निश्चित रूप से क्यूटी 5.5 में एक तकनीकी पूर्वावलोकन है - प्राइमटाइम के लिए तैयार नहीं है। – Volomike

@ वोलोमाइक मैंने हाल ही में qml के लिए अधिक समय निवेश नहीं किया था और विशेष रूप से इस विषय में इस एप्लिकेशन की रिलीज मार्च 2013 में वापस आई थी। मुझे आश्चर्य है कि आप इसे एक पूर्वावलोकन मानते हैं। लिखने के समय यह था। आज मुझे लगता है कि वहाँ एक मजबूत कार्यान्वयन है जो "प्रयोगात्मक" prefixed नहीं है। दुर्भाग्यवश मेरे पास इस समय की जांच करने के लिए अभी समय नहीं है, लेकिन यह उत्तर पुराना प्रतीत होता है और वैसे भी "रिफैक्टरिंग" की आवश्यकता है। –

क्यूटी 5.6 बीटा 2015 नवंबर 20 है, लेकिन इसमें मिनीबॉउसर के तकनीकी पूर्वावलोकन के साथ क्यूटीवेब व्यू (क्यूवेब व्यू के साथ भ्रमित नहीं होना) शामिल है। मैंने अभी तक क्यूटी 5.6 बीटा की कोशिश नहीं की है। इस बीच, यहां 5.5 के बाद क्यूटी में वेब घटक दिशा के बारे में परेशान डेवलपर्स के साथ एक जीवंत चर्चा चल रही है: http://forum.qt.io/topic/55504/anyone-knows-the-future-of-qt-webkit – Volomike

क्यूटी 5.8.0 QML & जावास्क्रिप्ट बाध्यकारी

QML कोड

import QtQuick 2.0 
import QtWebEngine 1.4 
import QtWebChannel 1.0 

Item{ 
    id:root 
    height: 500 
    width: 500 

// Create WebChannel 
WebChannel{ 
    id: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) { 
       sendTextMessage(arg); 
      } 

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


    function someMethod(message) { 
     console.log(message); 
     someSignal(message); 
     return dataManager.getGeoLat(); 
    } 

    property string hello: "world"; 
} 

Rectangle{ 
    anchors.fill: parent 
    color: "black" 

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

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

एचटीएमएल कोड

<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 
    alert(foo.hello); 

    // 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); 
    }); 
}); 
</script>

स्रोत

2017-05-10 06:07:08 SourabhKus

वेबव्यू से सी ++ विधि को आमंत्रित करें जावास्क्रिप्ट

उत्तर

संबंधित मुद्दे