Consuming WebSocket messages from the web page

With everything configured on the server, it's time to wire things up in the client. Because JavaScript has a WebSocket API, and we aren't using subprotocols such as Simple (or Streaming) Text Oriented Message Protocol (STOMP), we don't need any extra libraries.

So we can augment our Thymeleaf template, index.html. It's important to point out that our template is in the images microservice, not the chat microservice we just created. Add the following chunk of code toward the bottom of the HTML:

    <script th:inline="javascript"> 
        /*<![CDATA[*/ 
        (function() { 
            ... custom JavaScript code here... 
        })(); 
        /*]]>*/ 
    </script> 

 

 

 

 

This preceding chunk of code can be explained as follows:

• The HTML <script> tag combined with th:inline="javascript" allows Thymeleaf to process it.
• To avoid HTML parsing in various browsers as well as our IDE, the entire code is wrapped with CDATA tags...