2.6 KiB
2.6 KiB
HTML FRONTEND + C++ HOOKS
You can definitely run your HTML dashboard in Chromium kiosk mode and still have it talk to your existing C++/Qt backend. The trick is to bridge the browser UI with your native code. Here are the main approaches:
🔗 Integration Options
1. Local WebSocket / TCP server
- Run a lightweight server inside your C++ app (e.g. using
QtWebSocketsorQTcpServer). - Your HTML buttons call JavaScript functions that send JSON messages over WebSocket.
- Example:
function sendCommand(cmd, payload={}) { socket.send(JSON.stringify({command: cmd, data: payload})); }// Qt side connect(webSocketServer, &QWebSocketServer::newConnection, this, [=](){ auto client = webSocketServer->nextPendingConnection(); connect(client, &QWebSocket::textMessageReceived, this, [=](const QString &msg){ QJsonDocument doc = QJsonDocument::fromJson(msg.toUtf8()); QString cmd = doc["command"].toString(); // handle command }); });
2. REST API (HTTP server)
- Expose endpoints in your C++ app (
/setRainfall,/getStatus, etc.). - HTML buttons use
fetch()to call these endpoints. - Example:
fetch("http://localhost:8080/setRainfall", { method: "POST", body: JSON.stringify({value: 12.4}), headers: {"Content-Type":"application/json"} });
3. Native Messaging (Chromium extension)
- If you need tighter integration, you can build a Chromium extension that talks to your C++ app via Native Messaging.
- More complex, but allows secure communication without opening a server port.
🖥️ Kiosk Mode Setup
- Launch Chromium with flags:
chromium --kiosk --app=file:///home/user/dashboard.html - This runs fullscreen, hides controls, and loads your HTML UI.
⚙️ Recommended Path
For your case (Qt backend + kiosk UI), the WebSocket approach is usually the cleanest:
- Qt has built-in WebSocket support.
- Easy to send structured JSON messages both ways.
- Works offline, no need for external servers.
🚀 Next Step
Would you like me to sketch out a minimal working example where:
- A button in the HTML dashboard sends a command (
"toggleSiren") - Your Qt app receives it and prints/logs the action?
That way you’ll see the full round-trip between Chromium kiosk and your C++ backend.