How to build a C++ desktop application using HTML, JavaScript and CSS for UI

[Manjunatha]

Hi,

I want to build a C++ desktop application and I need to use HTML, JavaScript, and CSS for UI part. The UI part should contain Graphs, Charts etc.. I should take inputs from the C++ application asynchronously. The C++ application should be running continuously in the background, at the same time the output must be shown on the HTML page.

I need a sample desktop application that uses JavaScript to call a C++ application for input and then displays it on the HTML page (browser).

Thank you.

[Öö Tiib]

Web pages in browsers are rather well sand-boxed for security. So unless you
write web browser plugin you can't interact with any locally running
programs from a web-page in browser.

Making such plugin for each browser on each platform supported means
significant skill and manpower needed. One remotely capable would not
ask that question because far more hard is to reach such customer
trust level to deploy and install those (potential security hole)
plugins.

So best you can likely do is to write web service in C++, run that
service on local web server and interact like all web-pages interact
with web services. Typically over REST (client requests, service
responds) or WebSocket (both sides may send something actively).

[Paavo Helde]

You can either integrate the browser into your desktop application or
have it a separate browser. For integrating one can use the MS
WebBrowser control in Windows, for example
("https://msdn.microsoft.com/en-us/library/system.windows.forms.webbrowser(v=vs.110).aspx")
which can be used from different languages like C# and C++. The
advantage is that you can manipulate the displayed web page
programmatically from inside the C++ program, and you can add other UI
elements to your app.

Alternatively, you could have a background C++ application and
displaying the UI in the standard browser. This would be more like a
standard web server, and the user interface would be just a normal web
page. The advantage here is that the browser and the server part can run
on different machines.

In both cases you will need a HTTP server component in your C++ part
which serves the browser requests. I highly recommend the Boost.asio
library, take one of their HTTP server examples and build on that.
Alternatively, you could take an existing web server like apache or
nginx and implement your application as a web server extension. As other
people have mentioned it is not clear that C++ would be the best main
language for such a project.

hth
Paavo

[Thiago Adams]

See https://electronjs.org/

[Dombo]

Op 09-Feb-18 om 7:17 schreef Manjunatha:

> Hi,
>
> I want to build a C++ desktop application and I need to use HTML, JavaScript, and CSS for UI part. The UI part should contain Graphs, Charts etc.. I should take inputs from the C++ application asynchronously. The C++ application should be running continuously in the background, at the same time the output must be shown on the HTML page.
>
> I need a sample desktop application that uses JavaScript to call a C++ application for input and then displays it on the HTML page (browser).

You might want to take a look at:
https://www.webtoolkit.eu/wt

[Real Troll]

You can do it quite easily in ASP.NET core using C# as the back-end. It
is cross platform and it works very fast. The deployment is via
compiled DLLs on your machine.

<https://docs.microsoft.com/en-us/aspnet/core/>

[Christiano]

I can see three choices:

1- CGI
======

The organization would be:
Client: JS+HTML app
Server: your C++ program (CGI) + HTTP server

The client sends a request to Server asynchronously (XMLHttpRequest)
Your Server can reply the request now or after.
When the server replies, the client reads the information and send other request again.

So, in this option you must to read about CGI programming using C++ and Javascript Asynchronous XMLHttpRequest()

2- Similar to (1), but using Wt in server side
================================================

If you use Dombo idea, that is, use wt, and if you deploy it as wthttp, then you don't need a separated server like Apache HTTPD.
(read more: https://www.webtoolkit.eu/wt/doc/tutorial/wt.html#_deployment)

3- Native C++ using Chrome Native.
===================================

You can write a C++ program which will be loaded together with HTML and JS.
The following website has examples of how to do exactly what you want:
https://developer.chrome.com/native-client

In this solution you could add the NW.js (similar to electron proposed by Thiago) in order to your application to be independent (chromium (nw.js) + native C++ + JS + HTML, All together like a desktop app)

I don't know if Firefox has similar native thing.