পাইথন কলব্যাকের সাথে ওয়েবকিট ওয়েবভিউ ফর্মটি সংযুক্ত করবেন?

31

আমি একটি ছোট পাইথন এবং ওয়েবকিট অ্যাপ লিখছি; আমি আমার অ্যাপ্লিকেশনের জন্য ওয়েবকিটটিকে ইউআই হিসাবে ব্যবহার করছি।

আমি যা করতে চাই তা হ'ল ওয়েবকিতে একটি ইন্টারেক্টিভ উপাদান তৈরি করা (যথা একটি কম্বো বাক্স বা ক্লিকযোগ্য অঞ্চলগুলির একটি সেট) এবং যখন ব্যবহারকারী এই উপাদানগুলির সাথে যোগাযোগ করে আমি কিছু প্রসেসিং করার জন্য পাইথন কলব্যাক কল করতে পারি এবং তারপরে ওয়েবকিট ভিউ আপডেট করতে পারি নতুন তথ্য.

আমি কী করতে চাই তার একটি উদাহরণ এখানে দেওয়া হয়েছে:

ব্যবহারকারীর বিকল্পগুলির একটি কম্বো বাক্স উপস্থাপিত হয়েছে (কম্বো বাক্স প্রদর্শিত হবে, আমি ধরে নিই, ওয়েবকিটে একটি HTML ফর্ম ব্যবহার করে)।
কম্বো বাক্স বিকল্পটি নির্বাচিত on_combo_selected()হলে আমার পাইথন স্ক্রিপ্টে ডাকা হয় যা পরে কিছু তথ্য গ্রহণ করে।
ডেটা ওয়েবকিটকে দেওয়া হয় এবং ভিউ আপডেট হয়।

কিভাবে আমি এটি করতে পারব?

— jonobacon
সূত্র

31

এম্বেড করা ওয়েবকিট উইজেট থেকে নিয়ন্ত্রণকারী পাইথন প্রোগ্রামে যোগাযোগ করার উপায়

Gtk বা Qt:

window.statusজাভাস্ক্রিপ্ট থেকে সেট ; পাইথনে সম্পর্কিত ইভেন্টটি ফাঁদে ফেলুন
document.titleজাভাস্ক্রিপ্ট থেকে সেট ; পাইথনে সম্পর্কিত ইভেন্টটি ফাঁদে ফেলুন
পৃষ্ঠাটি একটি কাস্টম ইউআরএলে পুনর্নির্দেশ করুন (বলুন x-my-app:thing1/thing2/thing3); navigation-policy-decision-requestedপাইথনে ট্র্যাপ ইভেন্ট এবং নেভিগেট করা হচ্ছে এমন ইউআরএলটি দেখুন এবং এটি যদি আপনার কাস্টম ইউআরএল স্কিম হয় তবে এটিকে মোকাবেলা করুন

কেবল কিউটি:

ব্যবহার frame.addToJavaScriptWindowObjectজাভাস্ক্রিপ্ট বিশ্বব্যাপী নামস্থান করার জন্য একটি (বিশেষভাবে ডিজাইন করা) পাইথন বস্তুর যোগ করার জন্য; জাভাস্ক্রিপ্ট থেকে কল কল পদ্ধতি। ( উদাহরণস্বরূপ http://pysnippet.blogspot.com/2010/01/calling-python-from- জাভাস্ক্রিপ্ট- in-pyqts.html দেখুন ))

যে পদ্ধতিগুলি তাত্ত্বিকভাবে কাজ করা উচিত তবে বাস্তবে কার্যকর হয় না, খুব ভাল

একটি জাভাস্ক্রিপ্ট থেকে এইচটিএমএল উপাদানে (যা ডকুমেন্ট অবজেক্ট অন্তর্ভুক্ত করবে) একটি কাস্টম ডিওএম ইভেন্ট ফায়ার করুন; পাইথন থেকে ওয়েবকিট ডিওএম নেভিগেট করে এবং ইভেন্টগুলির কথা শোনার মাধ্যমে পাইথনের সেই ইভেন্টটি ফাঁদে ফেলুন। এটি কাজ করে, তবে পাইথন ইভেন্ট থেকে কাস্টম ডেটা পড়তে সক্ষম হওয়ার কোনও উপায় খুঁজে পাচ্ছি না, যার অর্থ আপনি ইভেন্টটি চালানো ছাড়া অন্য কোনও তথ্য পাস করতে পারবেন না।

পাইথন থেকে জাভাস্ক্রিপ্টে যোগাযোগ করার উপায়

ব্যবহার webview.execute_script(js_code)। মনে রাখবেন যে আপনি যদি জেএসের সাথে পরিবর্তনশীল মানগুলি পাস করে থাকেন তবে জেএসওএন তাদের এনকোড করা ভাল ধারণা; এইভাবে আপনি পালানোর বিষয়ে কিছুটা চিন্তা করতে পারেন এবং জেএস স্থানীয়ভাবে জেএসএন পড়তে পারেন

এখানে কিছু উদাহরণ জিটিকি কোড রয়েছে:

from gi.repository import Gtk,WebKit
import json

w = Gtk.Window()
v = WebKit.WebView()
sw = Gtk.ScrolledWindow()
w.add(sw)
sw.add(v)
w.set_size_request(400,300)
w.connect("destroy", lambda q: Gtk.main_quit())
def window_title_change(v, param):
    if not v.get_title():
        return
    if v.get_title().startswith("msgtopython:::"):
        message = v.get_title().split(":::",1)[1]
        # Now, send a message back to JavaScript
        return_message = "You chose '%s'. How interesting." % message
        v.execute_script("jscallback(%s)" % json.dumps(return_message))
v.connect("notify::title", window_title_change)
v.load_html_string("""<!doctype html>
<html>
<head>
<title>A demo</title>
<style>
body { font-family: Ubuntu, sans-serif; }
h1 { font-size: 1.3em; }
</style>
<body>
<h1>A tiny JavaScript demonstration</h1>
<form>
<p>What's your favourite thing about Jono? <select>
    <option>------choose one------</option>
    <option>his beard</option>
    <option>his infectious sense of humour</option>
    <option>his infectious diseases</option>
    <option>his guitar ability</option>
    <option>his wife</option>
</select></p>
</form>
<p id="out"></p>

<script>
document.querySelector("select").addEventListener("change", function() {
    var chosenOption = this.options[this.selectedIndex].text;
    // Now send that text back to Python by setting the title
    document.title = "msgtopython:::" + chosenOption;
}, false);
function jscallback(msg) {
    document.getElementById("out").innerHTML = msg;
}
</script>

</body>
</html>
""", "file:///")
w.show_all()
Gtk.main()

— Sil
সূত্র

18

আমি এটির সাথে খেলে কিছুদিন হয়ে গেছে তবে আমি যা করেছি তা এখানে:

এর মতো কিছু ব্যবহার করুন

<form>
    <select  onchange="location.href='mycombo://'+this.value">
      <option>foo</option>
      <option>bar</option>
      <option>baz</option>
    </select>
</form>

আপনার এইচটিএমএলে সুতরাং যখন ব্যবহারকারী একটি mycombo-আরআই আইটেম নির্বাচন করে নির্বাচিত মান বলা হয়। এটি ধরতে আপনার হ্যান্ডলারটিকে আপনার ওয়েবভিউর navigation-requestedসিগন্যালে সংযুক্ত করুন:

self.webview.connect("navigation-requested", self.on_navigation_requested)

আপনার সিগন্যাল হ্যান্ডলারে আপনি অনুরোধটি কোনও mycomboইউআরআইয়ের জন্য কিনা তা পরীক্ষা করে দেখুন । যদি তাই কল on_combo_selected:

def on_navigation_requested(self, view, frame, req, data=None):
    uri = req.get_uri()
    scheme, path=uri.split(':', 1)
    if scheme == 'mycombo':
        self.on_combo_selected(path) 
        return True
    else:
        return False

আপনার ওয়েবভিউ আপডেট করতে execute_scriptকিছু জাভাস্ক্রিপ্ট কোড চালানোর জন্য এটির ফাংশনটি ব্যবহার করুন যা আপডেটগুলি করে:

self.webview.execute_script("document.title='Updated!';")

— ফ্লোরিয়ান ডিয়েচ
সূত্র

1

কীভাবে পোস্ট শিরোনামগুলি পুনরুদ্ধার করবেন req?

— ফ্লিম