The only difference to the RESTful API web page is the inclusion on line (7) of a message to indicate whether we have a connection to the Python server:
<body>
<h1>Flask Web Socket Example</h1>
LED is connected to GPIO {{pin}}<br>
Connected to server: <span id="connected">No</span> <!-- (7) -->
<br><br>
Brightness <span id="brightnessLevel"></span>:<br>
<input type="range" min="0" max="100"
value="0" class="brightnessLevel">
</body>
</html>
Congratulations! That's two Python servers and web page clients using two different transport layers you have just completed.
We have seen how to implement the same project to control an LED's brightness using both a RESTful API-based approach and a Web Sockets-based approach. These are two very common options for implementing web services and integrating...