Add MQTT TLS support and CA certificate handling

- Implemented toggle functionality for CA certificate visibility in the UI.
- Added MQTT TLS configuration options and handling in the backend.
- Integrated LittleFS for storing and retrieving the CA certificate.
- Updated MQTT connection logic to use TLS if enabled.

Author: mstegen

SmartEVSE-3/data/index.html

@@ -57,6 +57,15 @@
 
       $(document).ready(loadData());
 
+      // Function to toggle cert visibility
+      function toggleCertVisibility() {
+          if ($('#mqtt_tls').is(':checked')) {
+              $('#mqtt_ca_cert_wrapper').show();
+          } else {
+              $('#mqtt_ca_cert_wrapper').hide();
+          }
+      }
+
       /**
        * Helper function to query the DOM for a single element.
        */
@@ -296,6 +305,9 @@
                 $('#mqtt_username').val(data.mqtt.username);
                 $('#mqtt_password').val(data.mqtt.password);
                 $('#mqtt_topic_prefix').val(data.mqtt.topic_prefix);
+                $('#mqtt_tls').prop('checked', data.mqtt.tls).checkboxradio("refresh");  // Set and refresh widget
+                $('#mqtt_ca_cert').val(data.mqtt.ca_cert || '');
+                toggleCertVisibility();
             }
 
             if (data.settings.lcdlock == 1) {
@@ -364,6 +376,9 @@
             setTimeout("loadData()", 5000);
           });
       }
+
+      // Add event listener for TLS checkbox
+      $(document).on('change', '#mqtt_tls', toggleCertVisibility);
   </script>
 
 
@@ -1090,6 +1105,9 @@ <h1 id="serialnr" class="h5 mb-0 text-white-800">SmartEVSE-</h1>
                         $('.mqtt_settings').toggle();
                         if (mqttEditMode) {
                             $('#edit_mqtt_button').text("Close Settings")
+                            $.get("/mqtt_ca_cert", function(certData) {
+                                $('#mqtt_ca_cert').val(certData);
+                            });
                         } else {
                             $('#edit_mqtt_button').text("Edit Settings")
                         }
@@ -1101,7 +1119,9 @@ <h1 id="serialnr" class="h5 mb-0 text-white-800">SmartEVSE-</h1>
                             mqtt_port:         $('#mqtt_port').val(),
                             mqtt_username:     $('#mqtt_username').val(),
                             mqtt_password:     $('#mqtt_password').val(),
-                            mqtt_topic_prefix: $('#mqtt_topic_prefix').val()
+                            mqtt_topic_prefix: $('#mqtt_topic_prefix').val(),
+                            mqtt_tls:          $('#mqtt_tls').is(':checked') ? 1 : 0,
+                            mqtt_ca_cert:      $('#mqtt_ca_cert').val()
                         };
                         // Build query string with proper encoding
                         var query = Object.keys(params)
@@ -1368,10 +1388,14 @@ <h1 id="serialnr" class="h5 mb-0 text-white-800">SmartEVSE-</h1>
                                             <button onclick="toggleMqttEdit()" style="display:inline-block;" id="edit_mqtt_button">Edit Settings</button>
                                             <div class="mqtt_settings" style="display:none">
                                                 <label>Host: <input id="mqtt_host" title="Leave empty to disable MQTT"></label>
-                                                <label>Port: <input id="mqtt_port"></label>
+                                                <label>Port: <input id="mqtt_port" title="Usually 1883 for MQTT, and 8883 for secure MQTTS"></label>
                                                 <label>Username: <input id="mqtt_username" title="Leave empty for anonymous MQTT"></label>
                                                 <label>Password: <input id="mqtt_password" title="Leave empty for anonymous MQTT"></label>
                                                 <label>Topic Prefix: <input id="mqtt_topic_prefix"></label>
+                                                <label>Enable TLS: <input type="checkbox" id="mqtt_tls" value="1"></label>
+                                                <div id="mqtt_ca_cert_wrapper" style="display:none;">
+                                                    <label>CA Certificate (PEM): <textarea id="mqtt_ca_cert" rows="10" style="width:100%; font-family:monospace;" title="Paste the PEM-formatted CA certificate here for TLS."></textarea></label>
+                                                </div>
                                                 <button onclick="configureMqtt()" style="display:inline-block;">Save</button>
                                             </div>
                                         </div>

SmartEVSE-3/src/esp32.cpp

@@ -20,6 +20,7 @@ char RequiredEVCCID[32] = "";                                               // R
 #include <Preferences.h>
 
 #include <FS.h>
+#include <LittleFS.h>
 
 #include <WiFi.h>
 #include "network_common.h"
@@ -483,6 +484,37 @@ void getButtonState() {
 }
 
 
+String readMqttCaCert() {
+    if (!LittleFS.exists("/mqtt_ca.pem")) {
+        _LOG_A("No /mqtt_ca.pem found.\n");
+        return "";
+    }
+    File file = LittleFS.open("/mqtt_ca.pem", "r");
+    if (!file) {
+        _LOG_A("Failed to open /mqtt_ca.pem for reading.\n");
+        return "";
+    }
+    String cert = file.readString();
+    file.close();
+    return cert;
+}
+
+void writeMqttCaCert(const String& cert) {
+    if (cert.isEmpty()) {
+        LittleFS.remove("/mqtt_ca.pem");
+        _LOG_D("Removed /mqtt_ca.pem.\n");
+        return;
+    }
+    File file = LittleFS.open("/mqtt_ca.pem", "w");
+    if (!file) {
+        _LOG_A("Failed to open /mqtt_ca.pem for writing.\n");
+        return;
+    }
+    file.print(cert);
+    file.close();
+    _LOG_D("Wrote %d bytes to /mqtt_ca.pem.\n", cert.length());
+}
+
 #if MQTT
 void mqtt_receive_callback(const String topic, const String payload) {
     if (topic == MQTTprefix + "/Set/Mode") {
@@ -1368,7 +1400,7 @@ bool handle_URI(struct mg_connection *c, struct mg_http_message *hm,  webServerR
         doc["mqtt"]["topic_prefix"] = MQTTprefix;
         doc["mqtt"]["username"] = MQTTuser;
         doc["mqtt"]["password_set"] = MQTTpassword != "";
-
+        doc["mqtt"]["tls"] = MQTTtls;
         if (MQTTclient.connected) {
             doc["mqtt"]["status"] = "Connected";
         } else {
@@ -2857,6 +2889,11 @@ extern void Timer20ms(void * parameter);
     validate_settings();
     ReadRFIDlist();                                                             // Read all stored RFID's from storage
 
+    // Note that LittleFS is also used by OCPP
+    if(!LittleFS.begin(true)) {
+        _LOG_A("LittleFS Mount Failed\n");
+    }
+        
     getButtonState();
 /*     * @param Buttons: < o >
  *          Value: 1 2 4

SmartEVSE-3/src/network_common.cpp

@@ -46,6 +46,7 @@ String MQTTHost = "";
 uint16_t MQTTPort;
 mg_timer *MQTTtimer;
 uint8_t lastMqttUpdate = 0;
+bool MQTTtls = false;
 #endif
 
 mg_connection *HttpListener80, *HttpListener443;
@@ -112,9 +113,23 @@ void mqtt_event_handler(void *handler_args, esp_event_base_t base, int32_t event
 void MQTTclient_t::connect(void) {
     if (MQTTHost != "") {
         char s_mqtt_url[80];
-        snprintf(s_mqtt_url, sizeof(s_mqtt_url), "mqtt://%s:%i", MQTTHost.c_str(), MQTTPort);
+        const char* scheme = MQTTtls ? "mqtts" : "mqtt";
+        snprintf(s_mqtt_url, sizeof(s_mqtt_url), "%s://%s:%i", scheme, MQTTHost.c_str(), MQTTPort);
         String lwtTopic = MQTTprefix + "/connected";
         esp_mqtt_client_config_t mqtt_cfg = { .uri = s_mqtt_url, .client_id=MQTTprefix.c_str(), .username=MQTTuser.c_str(), .password=MQTTpassword.c_str(), .lwt_topic=lwtTopic.c_str(), .lwt_msg="offline", .lwt_qos=0, .lwt_retain=1, .lwt_msg_len=7, .keepalive=15 };
+        
+        static String ca_cert_str;
+        if (MQTTtls) {
+            ca_cert_str = readMqttCaCert();
+            if (ca_cert_str.length() > 0) {
+                mqtt_cfg.cert_pem = ca_cert_str.c_str();
+                _LOG_D("Using CA cert from LittleFS (%d bytes).\n", ca_cert_str.length());
+            } else {
+                mqtt_cfg.cert_pem = NULL;
+                _LOG_A("No CA cert in LittleFS.\n");
+            }    
+        }
+
         MQTTclient.client = esp_mqtt_client_init(&mqtt_cfg);
         /* The last argument may be used to pass data to the event handler, in this example mqtt_event_handler */
         esp_mqtt_client_register_event(MQTTclient.client, (esp_mqtt_event_id_t) ESP_EVENT_ANY_ID, (esp_event_handler_t) mqtt_event_handler, NULL);
@@ -1230,6 +1245,17 @@ static void fn_http_server(struct mg_connection *c, int ev, void *ev_data) {
                     doc["mqtt_password_set"] = (MQTTpassword != "");
                 }
 
+                if (request->hasParam("mqtt_tls")) {
+                    MQTTtls = request->getParam("mqtt_tls")->value() == "1";
+                    doc["mqtt_tls"] = MQTTtls;
+                }
+
+                if(request->hasParam("mqtt_ca_cert")) {
+                    String cert = request->getParam("mqtt_ca_cert")->value();
+                    writeMqttCaCert(cert);                      // Save to LittleFS
+                    doc["mqtt_ca_cert_set"] = !cert.isEmpty();
+                }
+
                 // disconnect mqtt so it will automatically reconnect with then new params
                 MQTTclient.disconnect();
 #if MQTT_ESP == 1
@@ -1242,13 +1268,17 @@ static void fn_http_server(struct mg_connection *c, int ev, void *ev_data) {
                     preferences.putString("MQTTprefix", MQTTprefix);
                     preferences.putString("MQTTHost", MQTTHost);
                     preferences.putUShort("MQTTPort", MQTTPort);
+                    preferences.putBool("MQTTtls", MQTTtls);
                     preferences.end();
                 }
             }
 #endif
             String json;
             serializeJson(doc, json);
             mg_http_reply(c, 200, "Content-Type: application/json\r\n", "%s\r\n", json.c_str());    // Yes. Respond JSON
+        } else if (mg_http_match_uri(hm, "/mqtt_ca_cert") && !memcmp("GET", hm->method.buf, hm->method.len)) {
+            String cert = readMqttCaCert();
+            mg_http_reply(c, 200, "Content-Type: text/plain\r\n", "%s\r\n", cert.c_str());
         } else {                                                                    // if everything else fails, serve static page
             // Cache ".webp" or ".ico" image files for one year without revalidation or server checks.
             if (mg_match(hm->uri, mg_str("#.webp"), NULL) ||
@@ -1493,6 +1523,7 @@ void WiFiSetup(void) {
 #endif
         MQTTHost = preferences.getString("MQTTHost", "");
         MQTTPort = preferences.getUShort("MQTTPort", 1883);
+        MQTTtls = preferences.getBool("MQTTtls", false);
 #endif //MQTT
         preferences.end();
     }

SmartEVSE-3/src/network_common.h

@@ -56,6 +56,7 @@ extern String MQTTprefix;
 extern String MQTTHost;
 extern uint16_t MQTTPort;
 extern uint8_t lastMqttUpdate;
+extern bool MQTTtls;
 
 class MQTTclient_t {
 #if MQTT_ESP == 0
@@ -98,14 +99,16 @@ class MQTTclient_t {
 extern MQTTclient_t MQTTclient;
 extern void SetupMQTTClient();
 extern void mqtt_receive_callback(const String topic, const String payload);
+extern String readMqttCaCert();
+extern void writeMqttCaCert(const String& cert);
 #endif //MQTT
 
 // wrapper so hasParam and getParam still work
 class webServerRequest {
 private:
     struct mg_http_message *hm_internal;
     String _value;
-    char temp[64];
+    char temp[4096];     // allow CA cert to be sent 
 
 public:
     void setMessage(struct mg_http_message *hm);