WebSocket 实现链接群聊(low low low 版本)

py 文件:

"""下载 gevent-websocket 0.10.1基于Flask + geventWebSocket 建立连接,发送消息,实现群消息功能.
"""from geventwebsocket.server import WSGIServer  # 我要WSGI为我提供服务
from geventwebsocket.handler import WebSocketHandler  # WSGI 遇到 WS 协议的时候,用WebSocketHandler处理
from geventwebsocket.websocket import WebSocket  # 语法提示,使用方法:"# type:WebSocket"
from flask import Flask, request, render_templateapp = Flask(__name__)user_socket_list = []  # 存放所有链接到服务器的 socket
@app.route("/ws")
def my_websocket_func():# 获取到websocket链接.user_socket = request.environ.get("wsgi.websocket")  # type:WebSocketuser_socket_list.append(user_socket)    # 每个链接上来的socket都存放到 socket列表中一份while 1:msg = user_socket.receive()  # 通过连接等待接收客户端发送过来的消息for us in user_socket_list:# if us == user_socket:       # 当循环到的socket链接是自己的时候#     continuetry:us.send(msg)  # 把接收到的数据在发送回去except:continue@app.route("/group_p")
def group_p():return render_template("my_ws_mp.html")if __name__ == '__main__':http_server = WSGIServer(("0.0.0.0", 9527), application=app, handler_class=WebSocketHandler)http_server.serve_forever()

html 文件:

<!DOCTYPE html>
<html lang="zh-CN">
<head><meta http-equiv="content-Type" charset="UTF-8"><meta http-equiv="x-ua-compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1"><title>群聊</title>
</head>
<body>
<p>发送消息: <input type="text" id="message"><button onclick="send_msg()">发送</button>
</p>
<div id="message_list" style="width: 800px"></div>
<script>var ws = new WebSocket("ws://127.0.0.1:9527/ws");// 定义一个变量 ws,// new一个 WebSocket 对象,// 来发送 ws 协议请求 "ws://127.0.0.1:9527/ws"// 当 ws 收到消息时执行 onmessage// 触发 收到消息 用 onmessage
    ws.onmessage = function (event) {console.log(event.data);var ptag = document.createElement("p");     // 创建一个p标签
        ptag.innerText = event.data;        // p标签中的内容是 event.datavar divtag = document.getElementById("message_list");    // 找到 message_list 的 div标签
        divtag.appendChild(ptag);       //  把创建的p标签连同内容一起放到 这个 div 中
    };function send_msg() {var msg = document.getElementById("message").value;// 当点击"发送"按钮的时候,拿到要发送的内容
        ws.send(msg);// 发送出去
    }</script></body>
</html>

转载于:https://www.cnblogs.com/yuanyongqiang/p/10467009.html

WebSocket 实现链接群聊(low low low 版本)相关推荐

【Java分享客栈】SpringBoot整合WebSocket+Stomp搭建群聊项目
前言前两周经常有大学生小伙伴私信给我,问我可否有偿提供毕设帮助,我说暂时没有这个打算,因为工作实在太忙,现阶段无法投入到这样的领域内,其中有两个小伙伴又问到我websocket该怎么使用,想给自己的 ...
websocket学习和群聊实现
WebSocket协议可以实现前后端全双工通信,从而取代浪费资源的长轮询.在此协议的基础上,可以实现前后端数据.多端数据,真正的实时响应.在学习WebSocket的过程中,实现了一个简化版群聊,过程和 ...
js 链接websocket马上断开_WebSocket之基于STOMP协议的广播模式实现群聊功能
又是一个老套的古诗词赏析不恨此花飞尽,恨西园.落红难缀.--苏轼<水龙吟·次韵章质夫杨花词> WebSocket与STOMP协议相关简介 WebSocket WebSocket 是一种 ...
Node + WebSocket + Vue 聊天室创建群聊/加入群聊功能 – 第五章
前言本次算是做了一个小小的专题吧,"Nodejs + WebSocket + Vue实现聊天室功能",目前还在一步一步推进,之前已经可以一对一.一对多聊天了,今天就来创建群聊组, ...
thinkphp6+websocket 群聊实现
目录一.安装扩展二.websocket配置 1.worker_server.php 编辑注意事项分享:数据库形式 2.新建控制器Worker(名字随意) 总结一.安装扩展 cd到项目下进行扩 ...
django+vue3实现websocket聊天室（群聊）
1.如何实现聊天功能 2.什么是websocket 2.1解释什么叫全双工,半双工,单工 3.websocker的概念 4.websocket的优点 5.django ,vue如何实现websocke ...
websocket 群聊和单聊实现简单在线客服
根据菜鸟教程上的解释: WebSocket 使得客户端和服务器之间的数据交换变得更加简单,允许服务端主动向客户端推送数据.在 WebSocket API 中,浏览器和服务器只需要完成一次握手,两者之间 ...
SpringBoot与webSocket实现在线聊天室——实现私聊+群聊+聊天记录保存
SpringBoot与webSocket实现在线聊天室--实现私聊+群聊+聊天记录保存引用参考:原文章地址:https://blog.csdn.net/qq_41463655/article/det ...
springboot整合websocket实现群聊
1.依赖 2.websocket配置: 3.前端 4.注意事项效果: 也可以打开新窗口连接一个新用户发消息 1.依赖 <dependency><groupId>org.spr ...
(3)websocket实现单聊和群聊
1 资源下载地址 http://download.csdn.net/detail/jianfpeng241241/9325049 2 群聊图 2.1 zhangsan 发给所有人的图 2.2 发送 ...

WebSocket 实现链接群聊(low low low 版本)

WebSocket 实现链接群聊(low low low 版本)相关推荐

最新文章

热门文章

WebSocket 实现链接 群聊(low low low 版本)

WebSocket 实现链接 群聊(low low low 版本)相关推荐

最新文章

热门文章

WebSocket 实现链接群聊(low low low 版本)

WebSocket 实现链接群聊(low low low 版本)相关推荐