flask + websocket实现简单的单聊和群聊

单聊

 1 from flask import Flask,request,render_template
 2 from geventwebsocket.handler import WebSocketHandler
 3 from gevent.pywsgi import WSGIServer
 4 from geventwebsocket.websocket import WebSocket
 5 import json
 6
 7
 8 app = Flask(__name__)
 9
10 user_socket_dict = {}
11
12 @app.route('/ws/<username>')
13 def ws(username):
14     user_socket = request.environ.get('wsgi.websocket') # type:WebSocket
15     user_socket_dict[username] = user_socket
16
17     print(len(user_socket_dict),user_socket_dict)
18
19     while 1:
20         try:
21             msg = user_socket.receive()
22             msg = json.loads(msg)
23             to_user = msg.get('to_user')
24             content = msg.get('msg')
25             usocket = user_socket_dict.get(to_user)
26             recv_msg = {
27                 'from_user':username,
28                 'msg':content
29             }
30
31             usocket.send(json.dumps(recv_msg))
32         except:
33             pass
34
35 @app.route('/chat')
36 def chat():
37     return render_template('chat.html')
38
39
40 if __name__ == '__main__':
41     http_serv = WSGIServer(('0.0.0.0',5000),app,handler_class=WebSocketHandler)
42     http_serv.serve_forever()
43
44 python代码

代码

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>单聊</title>
 6 </head>
 7 <body>
 8     <input type="text" id="username">
 9     <button οnclick="open_ws()">连接服务器</button>
10     <p>给：<input type="text" id="to_user"></p>
11     <p>发送消息：<input type="text" id="msg"></p>
12     <button οnclick="send_msg()">发送</button>
13     <div id="chat" style="width: 500px; height: 500px;"></div>
14
15     <script type="text/javascript">
16         var ws = null;
17         function open_ws() {
18             var username = document.getElementById('username').value;
19             ws = new WebSocket('ws://192.168.19.34:5000/ws/' + username);
20             ws.onmessage = function (data) {
21                 var msg = JSON.parse(data.data);
22                 var ptag = document.createElement('p');
23                 ptag.innerText = msg.from_user + ':' + msg.msg;
24                 document.getElementById('chat').appendChild(ptag);
25             };
26         }
27
28         function send_msg() {
29             var msg = document.getElementById('msg').value;
30             var to_user = document.getElementById('to_user').value;
31             var send_obj = {to_user:to_user,msg:msg};
32             ws.send(JSON.stringify(send_obj));
33         }
34     </script>
35 </body>
36
37
38 </html>
39
40 页面

页面

群聊

 1 #!/usr/bin/env python
 2 # -*- coding=utf-8 -*-
 3 from flask import Flask,request,render_template
 4 from geventwebsocket.handler import WebSocketHandler
 5 from gevent.pywsgi import WSGIServer
 6 from geventwebsocket.websocket import WebSocket
 7 import json
 8
 9 app = Flask(__name__)
10
11 user_socket_list = []
12
13 @app.route('/ws')
14 def ws():
15     user_socket = request.environ.get('wsgi.websocket') # type:WebSocket
16     user_socket_list.append(user_socket)
17     print(len(user_socket_list),user_socket_list)
18     while 1:
19         try:
20             msg = user_socket.receive()
21             for usocket in user_socket_list:
22                 if usocket != user_socket:
23                     usocket.send(msg)
24         except:
25             user_socket_list.remove(user_socket)
26
27
28 @app.route('/chat')
29 def chat():
30     return render_template('ws.html')
31
32 if __name__ == '__main__':
33     http_serv = WSGIServer(('0.0.0.0',5000),app,handler_class=WebSocketHandler)
34     http_serv.serve_forever()
35
36 Python代码

代码

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>Title</title>
 6 </head>
 7 <body>
 8 <p>发送消息：<input type="text" id="msg"></p>
 9 <button οnclick="send_msg()">发送</button>
10 <div id="chat" style="width: 500px;height: 500px;"></div>
11 <script type="text/javascript">
12     var ws = new WebSocket('ws://192.168.19.34:5000/ws');
13     ws.onmessage = function (data) {
14         var ptag = document.createElement('p');
15         ptag.innerText = data.data;
16         document.getElementById('chat').appendChild(ptag);
17     };
18
19     function send_msg() {
20         var msg = document.getElementById('msg').value;
21         ws.send(msg)
22     }
23 </script>
24 </body>
25 </html>
26
27 页面

页面

转载于:https://www.cnblogs.com/duanhaoxin/p/10021794.html

flask + websocket实现简单的单聊和群聊相关推荐

Android 融云单聊与群聊消息免打扰功能设置与消息删除功能实现
一.设置群聊与单聊消息免打扰功能: 1.下面直接进入逻辑代码: 实现监听事件: /*** 设置会话列表界面操作的监听器.*/RongIM.setConversationListBehaviorList ...
Android 项目接入网易云信IM单聊，群聊
首先需要去网易云信注册账号: https://app.yunxin.163.com/index?clueFrom=nim&from=nim#/create 账号注册成功后去新建项目拿到集成需要 ...
socketio单聊，群聊
一个简单的聊天程序,功能有单聊,群聊页面如下所示: Name后面跟的是当前登录人的名字,下方的列表是当前在线的用户,双击该用户名后,可以给该用户发送消息.再次双击同一用户,下方会显示给所有(All) ...
LayIM 3.9.1与ASP.NET SignalR实现Web聊天室快速入门（七）之LayIM与MVC数据交互实现单聊和群聊
前言本系列文章特点:使用ASP.NET SignalR和LayIM快速入门对接,实现一对一聊天,群聊,添加聊天群组,查找聊天记录等功能.源代码不包含LayIM的源代码,因为官方并没开源属于收费资源, ...
陌生交友发布动态圈子单聊打招呼群聊app开发
陌生交友发布动态圈子单聊打招呼群聊app开发功能有,发布圈子,发布动态,查看附近的人,发布活动,实人认证,个人主页,相册查看,单聊,群聊. 即时通讯第三方goeasy接口. 好的,以下是陌生交友应用 ...
SpringBoot与webSocket实现在线聊天室——实现私聊+群聊+聊天记录保存
SpringBoot与webSocket实现在线聊天室--实现私聊+群聊+聊天记录保存引用参考:原文章地址:https://blog.csdn.net/qq_41463655/article/det ...
(3)websocket实现单聊和群聊
1 资源下载地址 http://download.csdn.net/detail/jianfpeng241241/9325049 2 群聊图 2.1 zhangsan 发给所有人的图 2.2 发送 ...
Node + WebSocket + Vue 聊天室创建群聊/加入群聊功能 – 第五章
前言本次算是做了一个小小的专题吧,"Nodejs + WebSocket + Vue实现聊天室功能",目前还在一步一步推进,之前已经可以一对一.一对多聊天了,今天就来创建群聊组, ...
ios开发多人语音聊天_iOS 新手集成单聊、群聊、语音和视频通话的简述
最近项目中有涉及到即时通讯的功能,所用到的是环信3.1.5的sdk.下面就开始介绍其过程: (1)集成环信SDK: pod:pod 'HyphenateFullSDK' 手动:因为我们要使用到语音和视 ...
Android集成网易云IM实现单聊和群聊
本人一直对即时通信感兴趣,但是我的日常工作与这个没有任何接触,所以一直没有时间去看,去研究,刚好最近有点空闲时间,便乘机去学习了一些皮毛废话和客套话也不多说,先看效果界面做的比较丑,大家不要在意哦 ...

flask + websocket实现简单的单聊和群聊

单聊

群聊

flask + websocket实现简单的单聊和群聊相关推荐

最新文章

热门文章