随笔- 93 文章- 8 评论- 1 阅读- 26291

Flask websocket

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

151

152

153

154

155

156

157

158

159

160

161

162

163

164

165

166

167

168

169

170

171

172

173

174

175

176

177

178

179

180

181

182

183

184

185

186

一.单方聊天
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="width: 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="width: 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>