I am trying just to do a "proof of concept". My goal is to create a web GUI with buttons that when pressed will trigger the send of a command to a piece of equipment. So I thought about creating this GUI using HTML and javaScript and send the command using JSON through a websocket to a websocket server in Phyton that would receive the message, communicate with the equipment and return the information to the web page through the websocket. So I created a simple page with two buttons, one asking for an ID and another one asking for a status byte. Both buttons call the same function passing the specific item as parameter. I harcoded the answer from the server (two different answers depending on the command received), to simplify things. So, when I press the get ID button, I receive the correct information from the server and the client closes the websocket... If now I want to press the second button, the server does not receive the "request". I have to refresh the client page in order to be able to press the second button and then I receive the correct information, but again the client closes the websocket... and I cannot press the first button again, as the websocket is closed. So my question is: why the websocket is closing? I am not experienced either with Python or with websockets. In my ignorance I thought that websockets should remain opened until I explicitly invoke the close() function, so I thought that I could implement as many buttons I wanted and the channel between client and server would remain always opened... Am I missing something? I am using Python 3.7. Everything is running under Windows10 and client html code is running in Chrome. Below you have the two files I created. Very basic GUI and even simpler server side.I would appreciate any light you can throw in my direction on what I am missing.
Code for client side in html/JavaScript:
Code for client side in html/JavaScript:
<!DOCTYPE html> <html> <head> <title>WebSocket</title> <style> table { font-family: arial, sans-serif; border-collapse: collapse; width: 100%; } td, th { border: 1px solid #dddddd; text-align: left; padding: 8px; } </style> </head> <body> <script> // open webSocket on port 8765 var ws = new WebSocket("ws://localhost:8765/"); var counter = 0; // just to check if function txCommand is executed... /*** function executed when a button is pressed ***/ function txCommand(cmd) { // initializing variable for message to be sent var msg = { type:" ", command:" " }; // see which button was pressed switch (cmd) { case 1: { // button to read identification msg = { type:"message", command:"*IDN?" }; break; } case 2: { // button to read status byte msg = { type:"message", command:"*STB?" }; break; } default: } ws.send(JSON.stringify(msg)); counter = counter + 1; document.getElementById("demo").innerHTML = "Message Sent, counter = " + counter; }; ws.onopen = function() { // Web Socket is connected, send data using send() alert("Connection is opened..."); }; ws.onmessage = function(event){ var rx_msg = JSON.parse(event.data) switch(rx_msg.type) { case "msg1": { // answer for ID request document.getElementById("IDField").value = rx_msg.answer; document.getElementById("demo").innerHTML = "Message 1 Received"; break; } case "msg2": { // answer for ID request document.getElementById("statusByte").value = rx_msg.answer; document.getElementById("demo").innerHTML = "Message 2 Received"; break; } default: } }; ws.onclose = function() { // websocket is closed. alert("Connection is closed..."); }; ws.onerror = function (error) { alert('WebSocket Error ' + error); }; </script> <table> <tr> <th><button onclick="txCommand(1)">Get ID</button></th> <th>Identification: <input type="text" id="IDField" name="IDField" value=""></th> </tr> <tr> <th><button onclick="txCommand(2)">Get Status Byte</button></th> <th>Status Byte: <input type="text" id="statusByte" name="statusByte" value=""><br></th> </tr> </table> <p id="demo"></p> </body> </html>Code for the server side:
#!/usr/bin/env python import asyncio import websockets import json async def answer_command(websocket, path): JSONcmd = await websocket.recv() info_requested = json.loads(JSONcmd) print(info_requested) print(info_requested["type"]) print(info_requested["command"]) if info_requested["command"] == "*IDN?": answer = { "type": "msg1", "answer": "Bob Test1!" } elif info_requested["command"] == "*STB?": answer = { "type": "msg2", "answer": "Bob Test2!" } else: answer = { "type": "msg99", "answer": "Error!" } janswer = json.dumps(answer) print(janswer) await websocket.send(janswer) print("Answer Sent back") start_server = websockets.serve(answer_command, 'localhost', 8765) asyncio.get_event_loop().run_until_complete(start_server) asyncio.get_event_loop().run_forever()