QT AND THE WEB Where are we today? Qt World Summit Berlin 2019 1 05.11.2019 About basysKom basysKom mbH About myse!" Is a Qt Service Partner since 2004 Development Lead @ basysKom Is located in Darmstadt and Nürnberg Is employing ~30 people Is part of t e UX Gr$ppe Provides services (consulting& training, coac ing and development' around Qt (oc$ses on tec nical)industrial applications of Qt %*+I and application development' 2 05.11.2019 $%trodu&t'o% The web 's %ow arou%d #0 years o!d Hyperte)t* HT+,* HTT-./0* web browser* web ser1er* .20 are om%'prese%t The web with 'ts 'mme%se su&cess3mass'" adopt'o% had a stro%4 '%flue%&e o% techno!o4y 6or a !ot o" use7cases web-techno!o4'es are the de"au!t # 05.11.2019 Is the web the Ho!y rai!? -roblems with web techno!o4'es Strongly fragmented ecosystem ,ots of c $rn (short/lived 0PIs, fashion/driven' 12ine is a special case ,imited use on (low/end' embedded hardware 4 System integration can be a mess 4 Performance issues 8 05.11.2019 It9s a web9s wor!d /o e1e% '% 2019 there are 4ood reaso%s to de1e!op %at'1e a((!'cat'o%s /t'!! a %at'1e "ramework has to pro1e 'tse!" &apable '% a ;web wor!d“ 5onsuming web services (Qt as a client' Providing web services (Qt as a server' 6endering web content wit Qt #etting Qt into t e browser 5 05.11.2019 QT AS A CLIENT = 05.11.2019 @se7>ases: Qt as a c!'ent Tas:A Th'%4s to &o%s'der Interface web/focused services Serialisation of API data 9ransport sec$rity Examples 0$t entication)a$t orization Upload)download of files Interacting 3it REST/ and/or :ebSoc;et/0PIs ? 05.11.2019 HTT-(s)-c!'ent QNetwor:A&&cessMa%a4er Dm!HttpReFuest 5== API JS/0PI t at can be used from Q+, Part of QtNet3or; +ostly analog to t e browser 0PI of t e same name 0 bit of an abstract name for a *ttpClient? ;-' 5an be used to pull data into a Q+,/only//foc$s Qt Q$ic; application 0PI can feel a bit dated w en coming from more modern async ronous environments 4 In Qt since 4@4 Both support //,3T,/ .1'a Cpe%//,0 B 05.11.2019 WebSo&:et7&!'ent WebSo&:ets GG bidirect'o%a! &o%%e&t'o% betwee% &!'e%t a%d ser1er 8nables t e server to p$sh events into t e client (browser' WebSo&:ets '% Qt Q:ebSoc;et provides a client Part of t e Q:ebSoc;ets module Provides a C== and Q+, API Supports T,S (3ss:/)' 9 05.11.2019 /erial'Hat'on/Deserial'Hat'o% I/CN D+, 9ypical format used on Web-0PIs 1ld/sc ool& but still around Supported t rough QJsonDocument and friends Part of Qt5ore Jar'ous opt'o%s '% Qt No JS1N-Sc ema support %t ere are add-ons t at wor; Q"+,StreamC6eaderD:riterE in Qt Core 3it QJsonDoc$ment t oug ' QDomDocument in Qt X+, Qt X+, Patterns for a validating parser 10 05.11.2019 Authent'&at'o%3AuthoriHat'o% >!'e%ts %eed to authe%t'cate themse!1es a4a'%st /upported '% Qt throu4h the (web) ser1'ces QNetworkAuthor'Hat'o% modu!e Ideally 3it out giving t e client t e username/password 10$t F, 2 Ideally 3it out giving t e client w olesales access Toke%7based authe%t'cat'o%3author'Hat'o% 11 05.11.2019 QT AS A SERVER 18 05.11.2019 @se7>ase: Qt as a ser1er Tas: Provide 6ES9 and/or WebSoc;et/0PIs wit Qt Examples Interfaces for test/automation *eadless Qt (Qt as a friendly)better C== to implement an embedded firm3are) Integration point for ot er applications (e.g. order import' Integration of legacy applications 15 05.11.2019 @se7>ase: Qt as a ser1er /o!ut'o%A QHtt(/er1erK /o!ut'o%A QWebSo&ket/er1er 0 Qt component t at as been missed by a lot of people Part of t e Qt WebSoc;et module 9 ere are q$ite a few Qt/ish *ttpServer projects on git ub, 0vailable since Qt J@4 none t at has critical mass is properly maintained 5=+ and Q+, bindings Now there 's a% ;oL&'a!< ta:e by The Qt Compa%y ttps:))code.qt.io)cgit)Gt/labs/Gt ttpserver.git) 5$rrently still a labs projectI #P, + commercial licensing 1= 05.11.2019 EENDERING WEB CONTENT WITH QT 1? 05.11.2019 @se7&ase: embedd'%4 web content Tas: /o!ut'o% 8Kisting web content needs to be rendered wit in a Q:ebEngine Qt application 4 8mbeddable bro3ser component based on 5 romium 8Kamples 4 QM, & 5== APIs 4 #eneric 3eb bro3ser 4 5ompleK API M enables compleK applications 4 :alled gardens 4 #ames Q:ebVie3 4 6eports 4 :raps a native bro3ser component on Android)i1S 4 1utput of aut oring tools t at produce 3eb content 4 (alls bac; to QWeb8ngine on ot er platforms 4 QM, only 4 Simple 0PI M ig level integration 1B 05.11.2019 @se7&ase: Web-HMI & Qt3>NN backend Tas: /o!ut'o% 0 miKed mode application w ere t e frontend is done Q:ebEngine to „ ostP t e HMI 3it web/tec nologies and t e bac;end 3it Qt)5== Q:ebC annel to enable access from browser/side JS to Deeper integration compared to a classic client)server Q1bjects scenario SeeB doc@Gt@io)Gt/J)G3ebc annel@ tml +otivation 4 Performance 4 ,egacy code %a;a@ Ovaluable business logicP' 19 05.11.2019 @se7&ases: embedded web browser Tas: :eb bro3ser for an embedded system ($ll/screen, no Window/+anager Not actually a „Qt applicationP, just taking advantage of t e pre-existing system integration wor; /o!ut'o%A Qt WebE%4'%e .a4a'%0 Ca1eats System/Integration can be tric;y ,arge component 6eGuires more powerful ardware %compared to Qt Q$ic;' 20 05.11.2019 GETTING QT INTO THE BRCWSEE 21 05.11.2019 @se7&ase: the browser as a remote d'splay Tas: /o!ut'o% O1A WebG, stream'%4 0n H+I/application t at is written in Qt should render 0 Qt QP0 t at is streaming webgl commands into a browser 4 myApp /platform 3ebgl 4 Device 3it out a display Qt Q$ic; only 4 6emote access to a device %3 ic as a display' #P, + Commercial licensing 6esol$tion independent ,atency is critical 1ne user at a time 8Kample: ttps:))333@Gt@io)bosc /built/3it /Gt 22 05.11.2019 @se7&ase: the browser as a remote d'splay /o!ut'o% O2A JN> NNC QP0 + :ebsoc;et/Proxy + NoNNC (JS/5lient' QWidget & Qt Q$ic; (3 en using t e sw/renderer' Is sending bitmaps 6esol$tion is fiKed! ,atency is critical 0lso one user at a time 2# 05.11.2019 @se7&ase: ru%%'%4 Qt i% the browser Tas: E)curs'o%A WebAssembly 0n application written in Qt needs to r$n inside Portable runtime %byte code, APIs) an unmodified web browser Implemented by all major browsers Not ing is to be installed Sec$rity wise t e r$ntime as t e same limitations as a reg$lar website E)am(!es *eadless devices In ouse soft3are distribution 28 05.11.2019 @se7&ase: ru%%'%4 Qt i% the browser /o!ut'o%A Qt "or WebAssembly Ee!at'1e!y !ar4e dow%!oads .P20+B "or a Qt Qu'&k a((!'&at'o%0 1Qcial platform wit Qt J@F3 333@Gt@io)Gt/examples-for/3ebassembly ,'%k t'me 's s!ow2 A((!'&at'o% %eeds to dea! w'th browser !'m'tat'o%s (ile access Net3or; access 25 05.11.2019 WEAP UP 2= 05.11.2019 Wrap u( 6our perspe&t'1es o% Qt a%d the web +ore? 5lient 0D,& S3agger& open0PI Server 9emplating& HT+, generation 6endering 5omplete :ebApplications in Qt> Qt in t e browser R >ome ta!k to us about your ;Qt a%d the web“ proQects Sou can find us at t e basysKom boot 2? 05.11.2019 QUE/TION/ 6ran: +eer:Rtter Development ,ead fran;@meer;oetter-basyskom@com 2B.