Flask websocket

一.单方聊天
1.app.py

# websocket
from geventwebsocket.server import WSGIServer # 我要WSGI为我提供服务
from geventwebsocket.handler import WebSocketHandler # WSGI 遇到 WS协议的时候,处理方式
from geventwebsocket.websocket import WebSocket # 语法提示

# 基于 Flask + geventwebsocket

from flask import Flask,request,render_template
import json

app = Flask(__name__)

# user_socket_dict = {"YWB":<geventwebsocket.websocket.WebSocket object at 0x000002699374A730>,
# "JWB":<geventwebsocket.websocket.WebSocket object at 0x000002699374A5F8>}

user_socket_dict = {}

@app.route("/ws/<nickname>")
def my_ws_func(nickname):
    # print(dir(request.environ))
    user_socket = request.environ.get("wsgi.websocket")  # type:WebSocket
    user_socket_dict[nickname] = user_socket
    print(len(user_socket_dict),user_socket_dict)
    # web + socket
    print(user_socket)
    while 1:
        msg = user_socket.receive() # 等待接收客户端发送过来的消息
        print(msg)
        msg = json.loads(msg) # Dict
        """
        {
            to_user:YWB
            from_user:JWB
            message:"你就是一只WB"
        }
        """
        to_user_socket = user_socket_dict.get(msg.get("to_user"))
        msg_json = json.dumps(msg)
        to_user_socket.send(msg_json)

@app.route("/one_p")
def one_p():
    return render_template("one_p.html")




if __name__ == '__main__':
    # app.run()
    http_serv = WSGIServer(("0.0.0.0",9527),application=app,handler_class=WebSocketHandler)
    http_serv.serve_forever()



2.one_p.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <p>登录<input type="text" id="nick"><button onclick="login()">登录</button></p>
    <p>给<input type="text" id="to_user"></p>
    <p>发送消息:<input type="text" id="message"><button onclick="send_msg()">发送</button></p>
    <div id="message_list" style=" 500px">

    </div>
</body>
<script type="text/javascript">
    var ws = null;

    function send_msg() {
        var msg = document.getElementById("message").value;
        var to_user = document.getElementById("to_user").value;
        var nick = document.getElementById("nick").value;
        var msg_obj = {
            to_user:to_user,
            from_user:nick,
            msg:msg
        };
        var msg_json = JSON.stringify(msg_obj);
        ws.send(msg_json);
    };

    function login() {
        var nick = document.getElementById("nick").value;
        ws = new WebSocket("ws://192.168.15.113:9527/ws/"+nick);
        ws.onmessage = function (event) {
            console.log(event.data);
            data_obj = JSON.parse(event.data);
            var ptag = document.createElement("p");
            ptag.innerText = data_obj.from_user + " : " + data_obj.msg;
            var divtag = document.getElementById("message_list");
            divtag.appendChild(ptag);
        };
    }


</script>
</html>

二.多方聊天
1.app.py
# websocket
from geventwebsocket.server import WSGIServer # 我要WSGI为我提供服务
from geventwebsocket.handler import WebSocketHandler # WSGI 遇到 WS协议的时候,处理方式
from geventwebsocket.websocket import WebSocket # 语法提示

# 基于 Flask + geventwebsocket

from flask import Flask,request,render_template

app = Flask(__name__)

user_socket_list = []

@app.route("/ws")
def my_ws_func():
    # print(dir(request.environ))
    user_socket = request.environ.get("wsgi.websocket")  # type:WebSocket
    user_socket_list.append(user_socket)
    # web + socket
    print(user_socket)
    while 1:
        msg = user_socket.receive() # 等待接收客户端发送过来的消息
        for us in user_socket_list:
            if us == user_socket:
                continue
            try:
                us.send(msg)
            except:
                continue

        # print(msg)
        # user_socket.send(msg)

@app.route("/group_p")
def group_p():
    return render_template("group_p.html")




if __name__ == '__main__':
    # app.run()
    http_serv = WSGIServer(("0.0.0.0",9527),application=app,handler_class=WebSocketHandler)
    http_serv.serve_forever()

2.group_p.html
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <p>发送消息:<input type="text" id="message"><button onclick="send_msg()">发送</button></p>
    <div id="message_list" style=" 500px">

    </div>
</body>
<script type="text/javascript">
    var ws = new WebSocket("ws://192.168.15.113:9527/ws");
    ws.onmessage = function (event) {
        console.log(event.data);

        var ptag = document.createElement("p");
        ptag.innerText = event.data;

        var divtag = document.getElementById("message_list");
        divtag.appendChild(ptag);
    };

    function send_msg() {
        var msg = document.getElementById("message").value;
        ws.send(msg);
    };


</script>
</html>

  

原文地址:https://www.cnblogs.com/PythonMrChu/p/10458649.html