https://github.com/vogler75/winccua-mqtt-client
MQTT Client Custom Web Control for SIEMENS WinCC Unified
https://github.com/vogler75/winccua-mqtt-client
Last synced: 27 days ago
JSON representation
MQTT Client Custom Web Control for SIEMENS WinCC Unified
- Host: GitHub
- URL: https://github.com/vogler75/winccua-mqtt-client
- Owner: vogler75
- License: mit
- Created: 2023-08-31T06:46:41.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2024-05-11T06:14:00.000Z (12 months ago)
- Last Synced: 2025-02-05T16:37:36.637Z (3 months ago)
- Language: HTML
- Size: 29.3 KB
- Stars: 11
- Watchers: 4
- Forks: 3
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# MQTT Client for WinCC Unified
It is a Custom Web Control for SIEMENS WinCC Unified to connect to MQTT brokers.
You have to download the webcc.min.js from SIEMENS and save it to the control/js directory ! You can get it out of a Custom Web Control example from [here](https://support.industry.siemens.com/cs/document/109779176/benutzerdefinierte-controls-in-wincc-unified-einbinden-(custom-web-controls)?dti=0&lc=de-WW)
Then you can create a Custom-Web.Control zip file from this directory:
> cd winccua-mqtt-client\Custom-Web-Control\{9117B3FF-7043-5BE4-B472-EA44D2488BF8}
> "C:\Program Files\7-Zip\7z.exe" a -tzip "..\{9117B3FF-7043-5BE4-B472-EA44D2488BF8}.zip" *
Copy the {9117B3FF-7043-5BE4-B472-EA44D2488BF8}.zip file to your project into the UserFiles\CustomControls directory.
Then you can drag and drop it to your screen and configure it.
The [Eclipse Paho JavaScript Client](https://eclipse.dev/paho/index.php?page=clients/js/index.php) is used in this Custom-Web-Control.
## Properties
* BrokerUrl: Url to your MQTT Broker, for example ws://192.168.1.1:9001/mqtt
* ClientId: MQTT Client Id
* Connect: Connect to MQTT Broker if it is set to true
* Debug: Some debug messages will be written to the browser console if set to true
* Topics: List of topics to which you want to subscribe. Example: ["test/+/value", "motor/#"]
* UseSSL: SSL connection will be used if set to true
* Username: Username to connect to the MQTT broker
* Password: Password to connect to the MQTT broker
## Events
* onConnect: fired when the connection is created.
* onConnectionLost: fired when the connection got lost
* onMessageArrived: fired when a message comes in.
Here is an example for the script on the onMessageArrived event.
```
export function MQTT_1_onMessageArrived(item, message) {
let data = JSON.parse(message);
switch (data.topic) {
case "test/gauge/1": Screen.Items("Gauge_1").ProcessValue = data.payload; break;
case "test/gauge/2": Screen.Items("Gauge_2").ProcessValue = data.payload; break;
}
}
```
The Message JSON-String looks like this:
```
{
"topic": "test/hello",
"payload": "Hello World!",
"qos": 0,
"retained": false,
"duplicate": false
}
```
## Method
There is a method "Publish" to publish values to the MQTT broker. It has one object as argument, which must contain "topic" and "payload". Optionally "qos" and "retained" can also be in the object.
Example
```
Screen.Items("MQTT_1").Publish(JSON.stringify({
"topic": "test/hello",
"payload": "Hello World!",
"qos": 0,
"retained": false
}));
```