简介
WebSocket是一种在单个TCP连接上进行全双工通信的协议。
WebSocket使得客户端和服务器之间的数据交换变得更加简单，允许服务端主动向客户端推送数据。在WebSocket API中，浏览器和服务器只需要完成一次握手，两者之间就直接可以创建持久性的连接，并进行双向数据传输。
Web - Socket 客户端 与 服务器 达成一个协议
websocket 客户端 与 websocket 服务器 达成一个websocket协议
来个小例子方便大家理解:
ws-socket.py
from flask import Flask,request from geventwebsocket.handler import WebSocketHandler from gevent.pywsgi import WSGIServer #应用程序网端接口的一个服务 from geventwebsocket.websocket import WebSocket #做语法提示用 app = Flask(__name__) @app.route("/conn_ws") def ws_app(): # print(request.environ) 请求原始信息 use_socket = request.environ.get("wsgi.websocket") #type:WebSocket #告诉编译器 use_socket的语法去WebSocket里面进行查找 #返回值是<geventwebsocket.websocket.WebSocket object at 0x000001FE56EDD868> while True: msg = use_socket.receive() #接收浏览器发来的消息 print(msg) use_socket.send(msg) #将接收到的消息返回给浏览器 http_serv = WSGIServer(("0.0.0.0",9527),app,handler_class=WebSocketHandler) #websocket不支持 Werkzeug,只支持wsgi,所以将Werkzeug替换掉; 如果不是Http请求，需要用WebSocketHandler处理机制 http_serv.serve_forever() #启动
my_ws.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> </body> <script type="application/javascript"> var ws = new WebSocket("ws://127.0.0.1:9527/conn_ws"); #创建一个ws的请求地址 ws.onmessage=function (messageEvent) { #接收服务器send到浏览器端的消息，一旦有消息会触发onmessage 机制 console.log(messageEvent.data)
} </script> </html>
websocket实现单群聊
ws-socket.py
import json from flask import Flask,request,render_template from geventwebsocket.handler import WebSocketHandler from gevent.pywsgi import WSGIServer from geventwebsocket.websocket import WebSocket app = Flask(__name__) user_socket_dict = {} @app.route('/conn/ws/<user_nick>') def ws_app(user_nick): user_socket = request.environ.get('wsgi.websocket') user_socket_dict[user_nick] = user_socket while True: msg = user_socket.receive() print(msg) msg_dict = json.loads(msg) to_user = msg_dict.get('to_user') if to_user: to_user_socket = user_socket_dict.get(to_user) #如果昵称存在,则是单聊;昵称为空,为群聊 to_user_socket.send(msg) else: for socket in list(user_socket_dict.values()): socket.send(msg) @app.route('/') def index(): return render_template('my_ws.html') if __name__ == '__main__': http_server = WSGIServer(('0.0.0.0',8888),app,handler_class=WebSocketHandler) http_server.serve_forever()
my_ws.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <input type="text" id="nick"><button onclick="login()">登录聊天室</button> <p>发送给: <input type="text" id="to_user"> 消息: <input type="text" id="msg"></p> <button id="send_btn" onclick="send()">发送</button> <p> <div id="chat_list"> </div> </p> </body> <script type="application/javascript"> var ws = null; function login() { var nick = document.getElementById('nick').value; ws = new WebSocket('ws://127.0.0.1:8888/conn/ws/'+nick); ws.onmessage = function (messageEvent) { console.log(messageEvent.data); var ptag = document.createElement('p'); #聊天记录 var message = JSON.parse(messageEvent.data); ptag.innerText = message.from_user + ':' + message.message; document.getElementById('chat_list').appendChild(ptag); }; } function send() { var message = document.getElementById('msg').value; var to_user = document.getElementById('to_user').value; console.log(to_user); if(to_user == null){ to_user = '' } var send_str = { from_user:document.getElementById('nick').value, to_user:to_user, message:message }; var json_send_str = JSON.stringify(send_str); ws.send(json_send_str); } </script> </html>