使用flask_socketio实现客户端间即时通信
前期没有来得及好好总结,现在复习总结一下:
1.Express 初始化 app 作为功能处理器,你可以将它传给 HTTP 服务器。
2.定义一个路由处理器 / ,当我们访问网站主页时就会调用这个处理器。
3.HTTP 服务器监听端口 3000。
通过传递 http(HTTP 服务器)对象初始化了一个 socket.io 的新实例。然后为到来的 socket 监听 connection 事件,并且输入日志到控制台。
这将加载 socket.io-client,创建全局变量 io,并且连接
下一个目标是我们从服务器发送事件给其他用户。
为了发送事件给所有人,Socket.IO 给我们提供了 io.emit:
io.emit('some event', { for: 'everyone' });
如果你想发送一个确定 socket 的消息给所有人,我们有 broadcast 标识:
io.on('connection', function(socket){
socket.broadcast.emit('hi');
});
关于flask_socketio的入门可以看我的上一篇博客《使用flask_socketio实现服务端向客户端定时推送》
用socketio实现即时通信十分简单,只需要客户端发送用户输入的信息到后端,后端再将此信息广播到所有连接到此命名域的客户端就可以了。
from flask import Flask, render_template
from flask_socketio import SocketIO,emit app = Flask(__name__)
app.config['SECRET_KEY'] = 'secret!'
socketio = SocketIO(app) @app.route('/')
def index():
return render_template('index.html') @socketio.on('imessage', namespace='/test_conn')
def test_message(message):
emit('message',//后端广播信息的事件名最好跟前端发送信息的事件名不一样
{'data': message['data']},
broadcast=True) if __name__ == '__main__':
socketio.run(app, debug=True)
关键就是要在emit中加broadcast=True这一项,如果不加,只有发送信息的客户端能收到消息
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript" src="//code.jquery.com/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/socket.io/1.3.5/socket.io.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
namespace = '/test_conn';
var socket = io.connect(location.protocol + '//' + document.domain + ':' + location.port + namespace);
//连接后发送日志
socket.on('connect', function(){
console.log('connected')
});
//点击发送时将text框的内容发送到后端
$('form#emit').submit(function(event) {
socket.emit('imessage', {data: $('#emit_data').val()});
return false;
});
//接收后端广播的信息
socket.on('message', function(msg) {
$('#log').append('<br>' + $('<div/>').text(msg.data).html());
});
});
</script>
</head>
<body>
<form id="emit" method="POST" action='#'>
<input type="text" name="emit_data" id="emit_data" placeholder="Message">
<input type="submit" value="发送">
</form>
<h2>Receive:</h2>
<div id="log"></div>
</body>
</html>
打开两个网页都连接到http://127.0.0.1:5000/,测试一下,一个网页发送的信息在另一个网页也可以及时收到。一个简陋的多人聊天系统完成了:)
使用flask_socketio实现客户端间即时通信的更多相关文章
- 基于XMPP协议的Android即时通信系
以前做过一个基于XMPP协议的聊天社交软件,总结了一下.发出来. 设计基于开源的XMPP即时通信协议,采用C/S体系结构,通过GPRS无线网络用TCP协议连接到服务器,以架设开源的Openfn'e服务 ...
- 即时通信WebSocket 和Socket.IO
WebSocket HTML5定义了WebSocket协议,能更好的节省服务器资源和带宽,并且能够更实时地进行通讯. 在2008年诞生,2011年成为国际标准. 现在基本所有浏览器都已经支持了. We ...
- (转)基于即时通信和LBS技术的位置感知服务(三):搭建Openfire服务器+测试2款IM客户端
主要包含4个章节: 1. Java 领域的即时通信的解决方案 2. 搭建 Openfire 服务器 3. 使用客户端测试我们搭建的 Openfire 服务器 4. Smack 和 ASmack 一.J ...
- QQ 腾讯QQ(简称“QQ”)是腾讯公司开发的一款基于Internet的即时通信(IM)软件
QQ 编辑 腾讯QQ(简称“QQ”)是腾讯公司开发的一款基于Internet的即时通信(IM)软件.腾讯QQ支持在线聊天.视频通话.点对点断点续传文件.共享文件.网络硬盘.自定义面板.QQ邮箱等多种功 ...
- (转)基于即时通信和LBS技术的位置感知服务(二):XMPP协议总结以及开源解决方案
在<基于即时通信和LBS技术的位置感知服务(一):提出问题及解决方案>一文中,提到尝试使用XMPP协议来实现即时通信.本文将对XMPP协议框架以及相关的C/S架构进行介绍,协议的底层实现不 ...
- WEB即时通信
问题 传统的浏览器通信方式:基于HTTP协议的请求/响应模式. 早期:通过刷新浏览器来更新服务器端的数据 后来Ajax(XMLHttpRequest是核心):可以不用刷新浏览器更新服务器端数据.但是这 ...
- WebSocket实现Web端即时通信
前言 WebSocket 是HTML5开始提供的一种在浏览器和服务器间进行全双工通信的协议.目前很多没有使用WebSocket进行客户端服务端实时通信的web应用,大多使用设置规则时间的轮询,或者使用 ...
- java即时通信小例子
学习java一段时间了,今天写来一个即时通信的小例子练手在其过程中也学到了一些知识拿出来和大家分享,请路过的各位大神多多赐教... 好了下面讲一下基本的思路: 首先,编写服务器端的程序,简单点说吧就是 ...
- iOS开发之使用XMPPFramework实现即时通信(三)
你看今天是(三)对吧,前面肯定有(一)和(二),在发表完iOS开发之使用XMPPFramework实现即时通信(一)和iOS开发之使用XMPPFramework实现即时通信(二)后有好多的小伙伴加我Q ...
随机推荐
- bzoj3829 POI2014 FAR-FarmCraft
题目链接 思路 用\(f[i]\)表示完成第\(i\)棵子树所需要得时间. 考虑如果有两个子树\(a\)和\(b\),如果先去完成子树\(a\),那么对于花费得时间就是\(f[b] + siz[a] ...
- socketv 验证客户端链接的合法性,socketserver
补充: send()与sendall() 在python socket编程中,有两个发送TCP的函数,send()与sendall(),区别如下: socket.send(string[, flags ...
- tput
tput : 改变终端显示特性,常见用法如下: tput lines : 显示终端的行数 tput cols : 显示终端的列数 tput cup line_number collum_number ...
- Luogu P3966 [TJOI2013]单词
题目链接 \(Click\) \(Here\) 本题\(AC\)自动机写法的正解之一是\(Fail\)树上跑\(DP\). \(AC\)自动机是\(Trie\)树和\(Fail\)树共存的结构,前者可 ...
- (叉积,线段判交)HDU1086 You can Solve a Geometry Problem too
You can Solve a Geometry Problem too Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/3 ...
- php项目核心业务(增、删、改、查)(第三篇)
对增删改查数据库的封装 //php对数据库的封装 //Mysql_fetach($sql)函数查询所有的 function Mysql_fetach($sql){ $conn=mysqli_conne ...
- Java封装、继承整理
封装 3.1封装概念: 提高代码复用性 隐藏实现细节,对外访问提供公共接口 提高安全型 3.2封装举例 机箱就是隐藏实现细节,提供了公共的访问接口 3.3私有private 一般对成员属性的访问动作: ...
- 1411 - Ants(巨人与鬼)
参考博客 紫薯P230 题意:给出平面上n个白点n个黑点,要求两两配对,且配对所连线段没有交点. 紫薯思路:找出y坐标最小的点,如果多个,考虑x最小的.将其他点相对于这个点按极角从小到大排序,然后开始 ...
- go vendor管理Golang项目依赖
解决的问题 将源码拷贝到当前工程的vendor目录下,这样打包当前的工程代码到任意机器的$GOPATH/src下都可以通过编译. govendor 1.安装 go get -u -v github.c ...
- 云计算虚拟机技术-KVM安装
云计算虚拟机技术-KVM安装 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 身为运维的小伙伴估计大家都清楚KVM,因为在CentOS里面KVM还算很折腾的一个软件,早期CentOS ...