Flask 实现 WebSocket 通讯---群聊和私聊
一、WebSocket介绍
WebSocket是一种在单个TCP连接实现了服务端和客户端进行双向文本或二进制数据通信的一种通信的协议。
一次请求 - 服务器收到请求 开始和客户端握手 - 保持长连接 - 数据实时 - 连接永远保持
优点：长连接 并且不影响 收发请求
缺点：连接保持，是需要资源的
二、 Flask 实现 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__) if __name__ == '__main__':
# app.run()
# 启动服务
http_serv = WSGIServer(("0.0.0.0", 7856),application=app, handler_class=WebSocketHandler)
http_serv.serve_forever()
三、Python + Flask 实现 WebSocket 通讯
1、实现简单群聊
后端代码 my_ws_ql.py:
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():
user_socket = request.environ.get('wsgi.websocket') # type:WebSocket
#
user_socket_list.append(user_socket)
# web + socket
print(user_socket)
# 浏览器发起的http请求 None
# 用前端js发送的ws请求 <geventwebsocket.websocket.WebSocket object at 0x0000000003ADF2B8>
while 1:
msg = user_socket.receive() # 等待接收客户端发送过来的消息
for i in user_socket_list:
# # 剔除自己的连接(不给自己推送自己发的消息，这样自己就看不到自己发的消息只能看到其他人发的)
# if i == user_socket:
# continue
# 当循环到死链接时会抛出异常，这里捕捉一下，出现异常直接continue
try:
# 给其他连接推送消息
i.send(msg)
except:
continue
print(msg) @app.route('/group_chat')
def group_chat():
return render_template('group_chat.html') if __name__ == '__main__':
# app.run()
http_serv = WSGIServer(("0.0.0.0", 7856),application=app, handler_class=WebSocketHandler)
http_serv.serve_forever()
前端模板代码 group_chat.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.37:7856/ws");
// 当ws 收到消息时执行 onmessage 属性
ws.onmessage = function (event) {
console.log(event.data);
// 创建p标签，将接收到的消息加入p标签中
var ptag = document.createElement("p");
ptag.innerText = event.data;
// 将创建的p标签添加到页面中
var divtag = document.getElementById('message_list');
divtag.appendChild(ptag);
}; function send_msg() {
// 发送消息的函数
var msg = document.getElementById('message').value;
ws.send(msg);
}
</script>
</html>
2.实现简单的单独通讯
my_ws.py
import json from geventwebsocket.server import WSGIServer # 我要WSGI为我提供服务
from geventwebsocket.handler import WebSocketHandler # WSGI 遇到 WS协议的时候，处理方式
from geventwebsocket.websocket import WebSocket # 语法提示
from flask import Flask, render_template, request app = Flask(__name__) # user_socket_dict = {"ZWQ":<geventwebsocket.websocket.WebSocket object at 0x000002699374A730>,
# "清风徐来":<geventwebsocket.websocket.WebSocket object at 0x000002699374A5F8>} user_socket_dict = {} @app.route('/ws/<nickname>')
def my_ws_func(nickname): 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
"""
Dict
{
to_user:ZWQ
from_user:清风徐来
message: "我是清风徐来发给ZWQ的一条消息"
}
"""
to_user_socket = user_socket_dict.get(msg.get("to_user")) # 获取发送地址
msg_json = json.dumps(msg)
to_user_socket.send(msg_json) @app.route('/private_chat')
def privatre_chat():
return render_template('private_chat.html') if __name__ == '__main__':
http_ws = WSGIServer(("0.0.0.0",7856), application=app,handler_class=WebSocketHandler)
http_ws.serve_forever()
模板代码 private_chat.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.33:7856/ws/"+nick);
// 收到消息执行onmessage属性
ws.onmessage = function (event) {
data_obj = JSON.parse(event.data); // 将JSON数据反序列化
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>
Flask 实现 WebSocket 通讯---群聊和私聊的更多相关文章
- websocket实现群聊和单聊(转)
昨日内容回顾 1.Flask路由 1.endpoint="user" # 反向url地址 2.url_address = url_for("user") 3.m ...
- 一例完整的websocket实现群聊demo
前言 业余我都会花一些时间在tcp.http和websocket等领域的学习,现在觉得有点收获,所以把一个基于websocket的群聊功能的例子提供给大家玩玩.当然这是一个很完整的例子,包括webso ...
- Flask+WebSocket实现群聊与单聊功能
在开始我们的程序代码之前,先来了解一下相关的基础知识: 1.什么是websocket? (1)WebSocket是HTML5开始提供的一种在单个 TCP 连接上进行全双工通讯的协议.WebSocket ...
- Websocket实现群聊、单聊
Websocket 使用的第三方模块:gevent-websocket 群聊 ws群聊.py中的内容 from flask import Flask, request, render_template ...
- websocket实现群聊
server # @File: 群聊 from flask import Flask, render_template, request from geventwebsocket.handler im ...
- Flask实现简单的群聊和单聊
Flask是使用python写的一个简单轻量级的框架,今天我们使用Flask实现一个简单的单聊和群聊功能 . 主要思路 : 前端登录聊天室,聊天室信息包含用户的登录信息,相当于一个登录功能,会把这个信 ...
- Android中脱离WebView使用WebSocket实现群聊和推送功能
WebSocket是Web2.0时代的新产物,用于弥补HTTP协议的某些不足,不过他们之间真实的关系是兄弟关系,都是对socket的进一步封装,其目前最直观的表现就是服务器推送和聊天功能.更多知识参考 ...
- WebSocket群聊与单聊
一 . WebSocket实现群聊 py文件代码 # py文件 from flask import Flask, render_template, request from geventwebsock ...
- spring websocket 和socketjs实现单聊群聊,广播的消息推送详解
spring websocket 和socketjs实现单聊群聊,广播的消息推送详解 WebSocket简单介绍 随着互联网的发展,传统的HTTP协议已经很难满足Web应用日益复杂的需求了.近年来,随 ...
随机推荐
- HDU 4499.Cannon 搜索
Cannon Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65535/65535 K (Java/Others)Total Subm ...
- doctotext
文档解析库 http://www.it610.com/article/1936051.htm
- jquery中innerWidth()，outerWidth()，outerWidth(true)和width()的区别
jquery中innerWidth(),outerWidth(),outerWidth(true)和width()的区别 var a = 元素本身的宽度: width() = a: innerWidt ...
- XE4 for ios 谨慎处理字符串
由于xe4 for ios 里面的字符串处理有变化,具体可以参考官方文档,这两天帮一个朋友调试ios 的 应用,由于没有注意这一块,折腾了很长时间.特此记录下来,希望其他人不要走弯路. 以下面代码为 ...
- maven随笔
1.在我们项目顶层的POM文件中,我们会看到dependencyManagement元素.通过它元素来管理jar包的版本,让子项目中引用一个依赖而不用显示的列出版本号.Maven会沿着父子层次向上走, ...
- Python全栈2期 备忘
http://www.cnblogs.com/linhaifeng/ http://www.cnblogs.com/alex3714/ http://www.cnblogs.com/wupeiqi/ ...
- java中File的delete和deleteOnExit区别（转）
Java的File类中有两个delete方法:delete和deleteOnExit delete无需解释,为直接删除,deleteOnExit文档解释为:在虚拟机终止时,请求删除此抽象路径名表示的文 ...
- 201709011工作日记--ART与Dalvik&&静态类与非静态类
1.ART 与 Dalvik 的优缺点对比 什么是Dalvik:Dalvik是Google公司自己设计用于Android平台的Java虚拟机.dex格式是专为Dalvik应用设计的一种压缩格.Dalv ...
- 保留注释换行的python模块configparser
python语言用来解析配置文件的模块是ConfigParser,python3中是configparser模块,我在使用中发现write方法在将配置项重新写入文 件时,配置文件中的空行和注释行都会被 ...
- 从问题域看hadoop的各种技术
近些年来Hadoop生态系统发展迅猛,它本身包含的软件越来越多,同时带动了周边系统的繁荣发展.尤其是在分布式计算这一领域,系统繁多纷杂,时不时冒出一个系统,号称自己比MapReduce或者Hive高效 ...