Neues Zertifikat hochladen

Ein neues Zertifikat kann über das WebSocket an das HMI geschickt werden. Codieren Sie dazu das neue Zertifikat Base64 und schicken Sie es an das entsprechende Symbol.

Beispiel Zertifikat Upload aus einem HTML-Host Control:

In dem Beispiel kann ein Zertifikat über das Inputfeld selektiert werden. Dies wird anschließend geöffnet und der Inhalt Base 64 codiert. Der codierte String wird dann an das entsprechende Zertifikat Symbol im Server gesendet und überschreibt das alte.

<div id="TcHmiHtmlHost_1" data-tchmi-type="TcHmi.Controls.System.TcHmiHtmlHost" data-tchmi-height="300"
    data-tchmi-height-unit="px" data-tchmi-left="20" data-tchmi-left-unit="px" data-tchmi-top="87"
    data-tchmi-top-unit="px" data-tchmi-width="300" data-tchmi-width-unit="px">
    <input type="file" class="inputNewCertificate" accept=".pem, .pfx, .cer, .crt">
    <script>
        const fileInput = document.querySelector('.inputNewCertificate');

        fileInput.addEventListener('change', () => {
            // Stop early if the user did not select a file.
            if (!fileInput.files || fileInput.files.length === 0) {
                console.log('No file was selected.');
                return;
            }

            // Read the selected file as plain text.
            const selectedFile = fileInput.files[0];
            const reader = new FileReader();
            reader.onload = () => {
                // The file content is available in reader.result once loading is complete.
                const fileContent = String(reader.result ?? '');

                // Convert the text content to Base64 before writing it to the PLC symbol.
                const base64Content = btoa(fileContent);

                TcHmi.Symbol.writeEx('%s%TcHmiSrv.Config::CERTIFICATE%/s%', base64Content, function (data) {
                    if (data.error === TcHmi.Errors.NONE) {
                        // Successfully wrote the Base64 certificate content.
                    } else {
                        // Writing failed. Inspect the error details in the callback data.
                    }
                });
            };

            reader.onerror = () => {
                // FileReader failed to read the selected file.
                console.error('The selected file could not be read.');
            };

            reader.readAsText(selectedFile);
        });
    </script>
</div>