search

retifrav / retifrav.github.io

Mirror of my blog, the original thing is at https://decovar.dev/
https://retifrav.github.io
Other
13 stars 2 forks source link

151-html-from-qml-over-webchannel-websockets #19

Open retifrav opened 5 years ago

retifrav commented 5 years ago

Interacting with HTML from QML over WebChannel/WebSockets comments.

ghost commented 4 years ago

Thank you for publishing the article. If only Qt's docs were half as good. ;)

devyaz commented 4 years ago

As to why, for me it's to use socketio client from Qwebview engine to show remote solar installation status as gauges in qml. Bcoz there's no simple or proper socketio implementation

retifrav commented 4 years ago

But you can do it right from QML, why to use browser at all.

devyaz commented 4 years ago

How without using Qwebsokets?

On Wed, 18 Dec 2019 00:29 retif, notifications@github.com wrote:

But you can do it right from QML, why to use browser at all.

— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/retifrav/retifrav.github.io/issues/19?email_source=notifications&email_token=AE35ASL3SZJANDIGC4E264TQZFHDZA5CNFSM4HLYSJNKYY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOEHEFRWI#issuecomment-566778073, or unsubscribe https://github.com/notifications/unsubscribe-auth/AE35ASJVPE7NKADCPLCF3B3QZFHDZANCNFSM4HLYSJNA .

retifrav commented 4 years ago

Perhaps, I didn't get your case, but QML has WebSocket, hasn't it.

devyaz commented 4 years ago

Yes it has but can it connect to a socketio backend? And currently my Linux machine is throwing error on websockets it can't find it for a reason I can't resolve

On Wed, 18 Dec 2019 16:58 retif, notifications@github.com wrote:

Perhaps, I didn't get your case, but QML has WebSocket https://doc.qt.io/qt-5/qml-qtwebsockets-websocket.html, hasn't it.

— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/retifrav/retifrav.github.io/issues/19?email_source=notifications&email_token=AE35ASJUFRNXMXW5DDWXSI3QZI3CPA5CNFSM4HLYSJNKYY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOEHGMH5I#issuecomment-567067637, or unsubscribe https://github.com/notifications/unsubscribe-auth/AE35ASJ6PZLCX5PDLZDDTA3QZI3CPANCNFSM4HLYSJNA .

retifrav commented 4 years ago

Ah, it’s Socket.IO you’re after. We’ll, if it’s not a “standard” WebSocket, then indeed one can hardly expect it to work with default clients, especially that:

Socket.IO is not a WebSocket library with fallback options to other realtime protocols. It is a custom realtime transport protocol implementation on top of other realtime protocols

Then I guess in your case WebEngine/WebView + WebChannel combo actually makes sense :)

devyaz commented 4 years ago

Sure thanks! I tried importing it but you can't do jack with it

On Wed, 18 Dec 2019 22:17 retif, notifications@github.com wrote:

Ah, it’s Socket.IO you’re after. We’ll, if it’s not a “standard” WebSocket, then indeed one can hardly expect it to work with default clients, especially that:

Socket.IO is not a WebSocket library with fallback options to other realtime protocols. It is a custom realtime transport protocol implementation on top of other realtime protocols

Then I guess in your case WebEngine/WebView + WebChannel combo actually makes sense :)

— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/retifrav/retifrav.github.io/issues/19?email_source=notifications&email_token=AE35ASKUNPSG64LCBOVYKE3QZKAMFA5CNFSM4HLYSJNKYY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOEHHLR6Y#issuecomment-567195899, or unsubscribe https://github.com/notifications/unsubscribe-auth/AE35ASJKG2WY5EPX6CML7KTQZKAMFANCNFSM4HLYSJNA .

devyaz commented 4 years ago

One thing! All work's as expected I used socketio events to change the lake on your example but it takes 20 seconds to do so in qml but instantly in HTML to say "connected to server" am using server hosted HTML file. So not sure why the delay, woul you happen to know why?

On Thu, 19 Dec 2019 17:27 Martin Mtawali, mtunthama@gmail.com wrote:

Sure thanks! I tried importing it but you can't do jack with it

On Wed, 18 Dec 2019 22:17 retif, notifications@github.com wrote:

Ah, it’s Socket.IO you’re after. We’ll, if it’s not a “standard” WebSocket, then indeed one can hardly expect it to work with default clients, especially that:

Socket.IO is not a WebSocket library with fallback options to other realtime protocols. It is a custom realtime transport protocol implementation on top of other realtime protocols

Then I guess in your case WebEngine/WebView + WebChannel combo actually makes sense :)

— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/retifrav/retifrav.github.io/issues/19?email_source=notifications&email_token=AE35ASKUNPSG64LCBOVYKE3QZKAMFA5CNFSM4HLYSJNKYY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOEHHLR6Y#issuecomment-567195899, or unsubscribe https://github.com/notifications/unsubscribe-auth/AE35ASJKG2WY5EPX6CML7KTQZKAMFANCNFSM4HLYSJNA .

retifrav commented 4 years ago

Yeah, that sounds weird, and I really don’t know what could be the reason. It might be actually a bug somewhere on Qt’s side.

devyaz commented 4 years ago

Happy new year! I guess it's the webchannel that's the problem, once the js in HTML fires a io.connect() socketio does it and webchannel sort of waits for "websockets" connection all the while socketio is waiting for a connection and keeps retrying each time with a new connection id , and chromium/webchannel caches all tries then it lets go then back end receives all tries and assume it's 4 connections. But once connected everything flows like water. So I think you are right I could be a bug in Qt's webchannel/chromium even in output you can see it failed to upgrade socketio connection to websockets

On Thu, 26 Dec 2019 12:04 retif, notifications@github.com wrote:

Yeah, that sounds weird, and I really don’t know what could be the reason. It might be actually a bug somewhere on Qt’s side.

— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/retifrav/retifrav.github.io/issues/19?email_source=notifications&email_token=AE35ASLDEA4IEDQPA3BSX73Q2R6SHA5CNFSM4HLYSJNKYY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOEHVLEDI#issuecomment-569029133, or unsubscribe https://github.com/notifications/unsubscribe-auth/AE35ASL3EALGPNLKAL7ZC33Q2R6SHANCNFSM4HLYSJNA .

devyaz commented 4 years ago

So I managed to get it to work, I moved all my socketio js into window.onload = function() { new QWebChannel(qt.webChannelTransport, function(channel) function and now it connects instantly 😂 silly me

jmarianek commented 4 years ago

With Qt you can download application data and then work offline.

retifrav commented 4 years ago

What application data?

jmarianek commented 4 years ago

Sorry I wrote too short comment. You asked why anybody needs mix web content with Qt and not to use web frameworks. With web frameworks you usually work online and often mix backend (persistence, services, ...) parts with frontend parts (html, css, js, ...). If you need manipulate application data (show and edit - images, text, audio, ...) you must use online storage and cannot work offline. So if you have installed application which contains web pars (i.e. for showing html+css data), works offlne and wants manipulate app data, you can use Qt with Qt WebEngine/Qt WebView as you described (than you), or something simillar like Electron FW.

retifrav commented 4 years ago

That's the other part of the question I asked. One can use either purely HTML/CSS/JS based solution or purely Qt based solution, but what is the point of having this mix of Qt and HTML via WebChannel?

If someone wants an offline application, then why would he use tools for creating online application? And Electron is an excellent example of this retarded approach - it's just total shit.

grabouillon06 commented 4 years ago

Hello, I'm struggling with webengineviews and webchannels at the moment, but just to answer your question about why to use all this ...

myself, I'm far from being very clear on all this but as for me ...

I'm building a webmapping solution to display a lot of static and dynamic and animated thematic informations base on mapbox libraries with two targets, a web site and a standalone application.

The web site is mainly for public display and uses mapbox GL JS library that is highly flexible and complete ... I did a lot of work on it already, including display optimization using webworkers, web socket with django server

The standalone application provides easy tools to display, add, remove, modify some of the information and should use a second mapbox GL library for display that is not so flexible.

I don't want to double my effort of displaying information on a map, ie.: mix of layers, data sources, features ...

Using my website in the application (using webengine view) is a good way to interact with javascript code and associated Mapbox GL js library to display added, updated, information. Furthermore, I can have in the same app, several webengineview to compare with real information coming from the web ...

To me it seems far more easier to manage QT app than HTML like solution to build interfaces ...

To me, this sounds to be the best approach to avoid duplicated work.

Thanks for you article

this way, I have a flexible standalone app connected to my "optimized" website display.

retifrav commented 4 years ago

That is a good example. Indeed, in your case it makes much more sense. So yeah, looks like this crazy mix of Qt and web can indeed be justified.

One tiny note though - it's Qt, not QuickTime player :)

grabouillon06 commented 4 years ago

yop, thank you Sir, I have it working fine now. Your article and ... also the links you posted at the beginning of the article saved me huge amount of time.

have a very good day :-)