Html Socket

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/sockjs-client/1.1.4/sockjs.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/stomp.js/2.3.3/stomp.min.js"></script>

    <script>
      let client = null;
      let socket = new SockJS("/logs");
      client = Stomp.over(socket);

      client.connect({}, function (frame) {
        console.log("Connected !!");

        client.subscribe("/topic/log", function (data) {
          print(JSON.parse(data.body));
          console.log("Received message: " + data);
        });
      });

      function print(message) {
        let log = document.getElementById("logs");
        let newLogs = document.createElement("p");
        console.log("LOGS", log);

        newLogs.appendChild(document.createTextNode(message.content));
        log.appendChild(newLogs);
        console.log("LOGS", newLogs);
        console.log("MESSAGE", message);
      }
    </script>
  </head>
  <body>
    <h1>Logs</h1>
    <p id="logs"></p>
  </body>
</html>