1、嘮嘮叨叨
最近又回顧了下Websocket,發現已經忘的七七八八了。於是用js寫了客戶端,用python寫了服務端,來復習一下這方面的知識。
2、先看一下效果吧
2.1、效果1(一個客戶端連上服務的並發送消息)
2.2、效果2(另一個客戶端連上服務的並發送消息)
2.3、效果3(服務的收到客戶端的全部消息並返回消息)
2.4、效果4(一個客戶端掉線並不影響其它socket連接)
2.5、效果5(列取全部連接客戶端對象和當前發消息的客戶端對象)
3、核心代碼
3.1、Python
#! -*- coding: utf-8 -*- """ Author: ZhenYuSha Create Time: 2019-1-14 Info: Websocket 的使用示例 """ import asyncio import websockets websocket_users = set() # 檢測客戶端權限,用戶名密碼通過才能退出循環 async def check_user_permit(websocket): print("new websocket_users:", websocket) websocket_users.add(websocket) print("websocket_users list:", websocket_users) while True: recv_str = await websocket.recv() cred_dict = recv_str.split(":") if cred_dict[0] == "admin" and cred_dict[1] == "123456": response_str = "Congratulation, you have connect with server..." await websocket.send(response_str) print("Password is ok...") return True else: response_str = "Sorry, please input the username or password..." print("Password is wrong...") await websocket.send(response_str) # 接收客戶端消息並處理,這里只是簡單把客戶端發來的返回回去 async def recv_user_msg(websocket): while True: recv_text = await websocket.recv() print("recv_text:", websocket.pong, recv_text) response_text = f"Server return: {recv_text}" print("response_text:", response_text) await websocket.send(response_text) # 服務器端主邏輯 async def run(websocket, path): while True: try: await check_user_permit(websocket) await recv_user_msg(websocket) except websockets.ConnectionClosed: print("ConnectionClosed...", path) # 鏈接斷開 print("websocket_users old:", websocket_users) websocket_users.remove(websocket) print("websocket_users new:", websocket_users) break except websockets.InvalidState: print("InvalidState...") # 無效狀態 break except Exception as e: print("Exception:", e) if __name__ == '__main__': print("127.0.0.1:8181 websocket...") asyncio.get_event_loop().run_until_complete(websockets.serve(run, "127.0.0.1", 8181)) asyncio.get_event_loop().run_forever()
3.2、Html(JS)
<script> var socket; if ("WebSocket" in window) { var ws = new WebSocket("ws://127.0.0.1:8181/test"); socket = ws; ws.onopen = function() { console.log('連接成功'); alert("連接成功, 請輸入賬號和密碼"); }; ws.onmessage = function(evt) { var received_msg = evt.data; document.getElementById("showMes").value+=received_msg+"\n"; }; ws.onclose = function() { alert("斷開了連接"); }; } else { alert("瀏覽器不支持WebSocket"); } function sendMeg(){ var message=document.getElementById("name").value+":"+document.getElementById("mes").value; document.getElementById("showMes").value+=message+"\n\n"; socket.send(message); } </script>