WebSocket是HTML5開始提供的一種在單個 TCP 連線上進行全雙工通訊的協議。

在WebSocket API中，瀏覽器和伺服器只需要做一個握手的動作，然後，瀏覽器和伺服器之間就形成了一條快速通道。兩者之間就直接可以資料互相傳送。

瀏覽器通過 JavaScript 向伺服器發出建立 WebSocket 連線的請求，連線建立以後，客戶端和伺服器端就可以通過 TCP 連線直接交換資料。

當你獲取 Web Socket 連線後，你可以通過 send() 方法來向伺服器傳送資料，並通過 onmessage 事件來接收伺服器返回的資料。

以下 API 用於建立 WebSocket 物件。

varSocket
 
=newWebSocket(url,[protocol]);

Websocket Python3 Server例項

#!/usr/bin/env python

import asyncio
import websockets
import json

with open("web_so_cfg.json",'r') as load_f:
    global load_dict
    load_dict = json.load(load_f)
   
ipaddr=load_dict['server_url']
port=load_dict['server_port']
data_file=load_dict['data_file']
help_cmd=load_dict['help_cmd']
load_f.close()

print("ipaddr=",ipaddr)
print("port=",port)
print("data_file=",data_file)

file_name = data_file
top_items_name = ''

with open(file_name, 'r') as load_f:
    global load_dict_2
    load_dict_2 = json.load(load_f)

print('-----------------------------------')
for item in load_dict_2:
    top_items_name=top_items_name+item+'\n'
    print(item,'=',load_dict_2[item])
   
print('-----------------------------------')

async def ift_command_line(websocket, path):
    name = await websocket.recv()
    print("< {}".format(name))

    ift_message = "ift_command_line: {}".format(name)

    ift_message_str=ift_message+"  test msg"
    '''
    await websocket.send(ift_message_str)
    print("> {}".format(ift_message_str))
    '''

    print (name)

    if name == 'help':
        with open("web_so_cfg.json",'r') as load_f:
            load_dict = json.load(load_f)
            help_cmd=load_dict['help_cmd']
        load_f.close()
        help_name='the command help: '+help_cmd
        ift_message = "ift_command_line: {}!".format(help_name)
        await websocket.send(ift_message)
       
    elif name == 'get-json-topitem':
        ift_message = "ift_command_line(from server): {}!".format(top_items_name)
        await websocket.send(ift_message)
    elif 'get-json-value-of' in name:
        str_array=name.split('of')
        item=str_array[1].strip()
        print (item)
        if item in load_dict_2:
            value=load_dict_2[item]
        else:
            value='null'
           
        print(value)
        ift_message = "ift_command_line(from server): {}!".format(value)
        await websocket.send(ift_message)
    else:
        error_infor=name +' is not a command!'
        ift_message = "ift_command_line(from server): {}!".format(error_infor)
        await websocket.send(ift_message)
start_server = websockets.serve(ift_command_line, ipaddr, port)

asyncio.get_event_loop().run_until_complete(start_server)
asyncio.get_event_loop().run_forever()

Websocket server配置檔案web_so_cfg.json

{
    "server_url": "192.168.8.102",
    "server_port": "8765",
    "data_file": "Handbetrieb_Maske_b.JSON",
    "help_cmd":"get-json-topitem,get-json-value-of <itemname>,get-data,get-name,add-user,mod-user,mod-user-pwd,mod-user-service,create-json-with-name:value,parse-json-with-\"jsonstr\""
 }

Demo中使用的Json檔案：Handbetrieb_Maske_b.JSON

{
    "current_tester": "SSTM",
    "current_materdata": "D:\\SVN\\Weishaupt_E01600\\image\\daten\\sw\\M1.sw",
    "specimen_type": "1 Ph",
    "selected_axis": "1",
    "current_power_supply_unit": "Sinamics NT 3Ph 600V/120A",

    "power_supply_controls": {
        "setpoint_voltage": {
            "current_value": 50,
            "unit": "V",
            "min_value": 0,
            "max_value": 600,
            "supported_precision": 0.1
        },
        "setpoint_frequency": {
            "current_value": 45.0,
            "unit": "Hz",
            "min_value": 45.0,
            "max_value": 75.0,
            "supported_precision": 0.1
        }
    },
    "load_machine_controls": {
        "setpoint_speed": {
            "current_value": 0,
            "unit": "rpm",
            "min_value": 0,
            "max_value": 1000,
            "supported_precision": 0.1
        },
        "setpoint_current_limit_torque": {
            "current_value": 0,
            "unit": "Nmm",
            "min_value": 0,
            "max_value": 100,
            "supported_precision": 1
        },
        "setpoint_load_active": {
            "current_value": false
        }
    },
    "specimen_controls": {
        "setpoint_rotation_direction": {
            "current_value": "clockwise",
            "possible_values": [
                "clockwise",
                "counter clockwise"
            ]
        },
        "setpoint_speciment_power_supply_active": {
            "current_value": false
        },
        "setpoint_1uf_condensator_connected": {
            "current_value": false
        },
        "setpoint_2uf_condensator_connected": {
            "current_value": false
        },
        "setpoint_4uf_condensator_connected": {
            "current_value": false
        },
        "setpoint_7uf_condensator_connected": {
            "current_value": false
        },
        "setpoint_10uf_condensator_connected": {
            "current_value": false
        },
        "setpoint_20uf_condensator_connected": {
            "current_value": false
        },
        "setpoint_40uf_condensator_connected": {
            "current_value": false
        }
    },
    "measurement_setup_controls": {
        "setpoint_sample_rate": {
            "current_value": "20 Hz",
            "possible_values": [
                "20 Hz",
                "10 Hz",
                "1 Hz"
            ]
        },
        "setpoint_poweranalyzer_mode_set_to_local": {
            "current_value": false
        },
        "setpoint_countinous_measurement_recording_active": {
            "current_value": false
        }
    },

    "actions": [
        "shutdown_measurement",
        "start_resistance_measurement",
        "store_current_sample"
    ],

    "actual_values": [
        {
            "label": "time",
            "current_value": null,
            "unit": "s"
        },
        {
            "label": "angle",
            "current_value": null,
            "unit": "°"
        },
        {
            "label": "speed",
            "current_value": null,
            "unit": "rpm"
        },
        {
            "label": "torque",
            "current_value": null,
            "unit": "Nmm"
        },
        {
            "label": "p_mech",
            "current_value": null,
            "unit": "kW"
        },
        {
            "label": "frequency",
            "current_value": null,
            "unit": "Hz"
        },
        {
            "label": "voltage",
            "current_value": null,
            "unit": "V"
        },
        {
            "label": "current",
            "current_value": null,
            "unit": "A"
        },
        {
            "label": "p_electric",
            "current_value": null,
            "unit": "kW"
        },
        {
            "label": "Q_1",
            "current_value": null,
            "unit": "kVAR"
        },
        {
            "label": "S_1",
            "current_value": null,
            "unit": "kVA"
        },
        {
            "label": "cos_phi",
            "current_value": null,
            "unit": ""
        },
        {
            "label": "ETA_M",
            "current_value": null,
            "unit": ""
        },
        {
            "label": "Temp_1",
            "current_value": null,
            "unit": "°C"
        },
        {
            "label": "Temp_2",
            "current_value": null,
            "unit": "°C"
        },
        {
            "label": "Temp_3",
            "current_value": null,
            "unit": "°C"
        }
    ]
}

Websocket Python3 Client例項

#!/usr/bin/env python

import asyncio
import websockets
import json
with open("web_so_cfg.json",'r') as load_f:
     load_dict = json.load(load_f)
   
ipaddr=load_dict['server_url']
port=load_dict['server_port']
data_file=load_dict['data_file']
print("ipaddr=",ipaddr)
print("port=",port)
print("data_file=",data_file)

connect_addr_port='ws://'+ipaddr+':'+port
print("connect_addr_port=",connect_addr_port)

async def web_so_op():
    async with websockets.connect(connect_addr_port) as websocket:
        name = input("Enter the cmd--->> ")
        await websocket.send(name)
        print("> {}".format(name))

        greeting = await websocket.recv()
        print("< {}".format(greeting))

while True:
    asyncio.get_event_loop().run_until_complete(web_so_op())

Websocket JavaScript client例項

<!DOCTYPE html> 
<meta charset="utf-8" />

<html>
<h1>WebSocket Test</h1> 
<head> 
    <script>
        var wsocket;
  var flag=0;
  var ws_link;
        function Connect(){
   var url_port=document.getElementById("msg").value;
   if(flag==0){
    ws_link='ws://'+url_port;
    flag=1;
   }
   document.getElementById("receive_msg").innerHTML=ws_link;
            try{
    
               //wsocket=new WebSocket('ws://192.168.8.101:8765/'); 
      wsocket=new WebSocket(ws_link);
            }catch(e){ 
                alert('error'); 
                return; 
            } 
            wsocket.onopen = sOpen; 
            wsocket.onerror = sError;
            wsocket.onmessage= sMessage;
            wsocket.onclose= sClose;
        } 
        function sOpen(){
            alert('connect success!');
        }
        function sError(e){
            alert("error " + e);
   document.getElementById("receive_msg").innerHTML=e.data;
        }
        function sMessage(e){ 
            alert('server says:' + e.data);
   document.getElementById("receive_msg").innerHTML='server says:' + e.data;
   ;
        }
        function sClose(e){
            alert("connect closed:" + e.code);
        } 
        function Send(){
       
            wsocket.send(document.getElementById("msg").value);
        }
        function Close(){
            wsocket.close();
        } 
    </script>
</head> 
  
<body> 
<input id="msg" type="text"> 
<button id="connect" onclick="Connect();">Connect</button> 
<button id="send" onclick="Send();">Send</button> 

<div id="receive_msg"></div>

</body> 
  
</html>