Flask是使用python写的一个简单轻量级的框架,今天我们使用Flask实现一个简单的单聊和群聊功能 .

    主要思路 : 前端登录聊天室,聊天室信息包含用户的登录信息,相当于一个登录功能,会把这个信息记录在url中发送给后端,后端会把登录信息作为识别用户的标志,url中的信息会作为key值存在一个字典中:

    {'111': <geventwebsocket.websocket.WebSocket object at 0x000001AB31716118>, '222': <geventwebsocket.websocket.WebSocket object at 0x000001AB317160B0>}

    单聊也是基于这个key值实现的,如果发送的用户为空则默认为群聊;

一.导入相关的包并实例化一个Flask对象

import json

from flask import Flask, request, render_template
from geventwebsocket.handler import WebSocketHandler
from gevent.pywsgi import WSGIServer
from geventwebsocket.websocket import WebSocket app = Flask(__name__) #实例化一个Flask对象
user_socket_dict = {} #创建一个空字典

二.后端通过request.environ获取前端的所有信息,其中wsgi.websocket对应的值即用户对象,取出这个对象存入字典 :

@app.route('/ws_app/<user_nick>')     #设置Flask路由,前端通过访问这个地址拆解信息,<user_nick>即前端登录聊天室输入的内容
def ws_app(user_nick):
user_socket = request.environ.get("wsgi.websocket") # type:WebSocket #取出environ中的wsgi.websocket对应的值
user_socket_dict[user_nick] = user_socket #以<user_nick>为key在字典中插入用户信息
print(user_socket_dict)     #{'111': <geventwebsocket.websocket.WebSocket object at 0x000001AB31716118>, '222': <geventwebsocket.websocket.WebSocket object at 0x000001AB317160B0>}

三.通过receive取出用户要发送的内容并进行json转换,通过get方法取出to_user(要发送的对象的聊天号),如果没有返回0,后边再通过if判断区别单聊还是群聊:如果to_user存在,说明要发给单个用户,否则是群发. 

    while True:
msg = user_socket.receive() #取出发送内容 msg_dict = json.loads(msg)
to_user = msg_dict.get("to_user",0) #没有返回0
if to_user: #有发送对象 单聊
to_user_socket = user_socket_dict.get(to_user) #用get方法取出
to_user_socket.send(msg)
else: #没有发送对象 群聊
for usocket in list(user_socket_dict.values()):
usocket.send(msg) @app.route('/')
def index():
  return render_template('my_ws.html') if __name__ == '__main__':
http_serve = WSGIServer(('0.0.0.0', 9527), app, handler_class=WebSocketHandler)
http_serve.serve_forever() 

四.前端代码

 <body>
<p><input type="text" id="nick">
<button onclick="login()">登陆聊天室</button>
</p>
发送给:<input type="text" id="to_user">消息:<input type="text" id="send_str">
<button id="send_btn" onclick="send()">发送消息</button>
<p>
<div id="chat_list"> </div>
</p>
</body>
<script type="application/javascript">
var ws = null;
function login() {
var nick = document.getElementById("nick").value;
ws = new WebSocket("ws://192.168.***.***:9527/ws_app/" + nick);
ws.onmessage = function (messageEvent) {
console.log(messageEvent.data);
var ptag = document.createElement("p"); var message = JSON.parse(messageEvent.data); ptag.innerText = message.from_user + " : " + message.message;
document.getElementById("chat_list").appendChild(ptag);
};
} function send() {
var message = document.getElementById("send_str").value;
var send_str = {
from_user: document.getElementById("nick").value,
to_user: document.getElementById("to_user").value,
message: message
};
var json_send_str = JSON.stringify(send_str);
ws.send(json_send_str);
}
</script>

Flask实现简单的群聊和单聊的更多相关文章

  1. 如何用WebSocket实现一个简单的聊天室以及单聊功能

    百度百科中这样定义WebSocket:WebSocket协议是基于TCP的一种新的网络协议.它实现了浏览器与服务器全双工(full-duplex)通信——允许服务器主动发送信息给客户端.简单的说,We ...

  2. 一套高可用、易伸缩、高并发的IM群聊、单聊架构方案设计实践

    一套高可用.易伸缩.高并发的IM群聊.单聊架构方案设计实践 一套高可用.易伸缩.高并发的IM群聊.单聊架构方案设计实践-IM开发/专项技术区 - 即时通讯开发者社区! http://www.52im. ...

  3. WebSocket群聊与单聊

    一 . WebSocket实现群聊 py文件代码 # py文件 from flask import Flask, render_template, request from geventwebsock ...

  4. Websocket实现群聊、单聊

    Websocket 使用的第三方模块:gevent-websocket 群聊 ws群聊.py中的内容 from flask import Flask, request, render_template ...

  5. websocket实现群聊和单聊(转)

    昨日内容回顾 1.Flask路由 1.endpoint="user" # 反向url地址 2.url_address = url_for("user") 3.m ...

  6. Flask+WebSocket实现群聊与单聊功能

    在开始我们的程序代码之前,先来了解一下相关的基础知识: 1.什么是websocket? (1)WebSocket是HTML5开始提供的一种在单个 TCP 连接上进行全双工通讯的协议.WebSocket ...

  7. spring websocket 和socketjs实现单聊群聊,广播的消息推送详解

    spring websocket 和socketjs实现单聊群聊,广播的消息推送详解 WebSocket简单介绍 随着互联网的发展,传统的HTTP协议已经很难满足Web应用日益复杂的需求了.近年来,随 ...

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

    单聊 from flask import Flask,request,render_template from geventwebsocket.handler import WebSocketHand ...

  9. flask 第五章 WebSocket GeventWebsocket 单聊群聊 握手 解密 加密

    1.WebSocket 首先我们来回顾一下,我们之前用socket学习过的项目有: 1.django 2.flask 3.FTP - 文件服务 HTTP - TCP (特点): 1.一次请求,一次响应 ...

随机推荐

  1. 在订单服务中使用Hystrix进行熔断设置

    使用Hystrix熔断(上) 在一个分布式系统里,一个服务依赖多个服务,可能存在某个服务调用失败,         比如超时.异常等,如何能够保证在一个依赖出问题的情况下,不会导致整体服务失败,   ...

  2. I2C的协议层和物理层

    I2C 协议简介 I2C 通讯协议(Inter-Integrated Circuit)是由 Phiilps 公司开发的,由于它引脚少,硬件实现简单,可扩展性强,不需要 USART.CAN 等通讯协议的 ...

  3. Codeforces 1245 D. Shichikuji and Power Grid

    传送门 经典的最小生成树模型 建一个点 $0$ ,向所有其他点 $x$ 连一条边权为 $c[x]$ 的边,其他任意两点之间连边,边权为 $(k_i+k_j)(\left | x_i-x_j\right ...

  4. Java RadixSort

    Java RadixSort /** * <html> * <body> * <P> Copyright 1994-2018 JasonInternational ...

  5. 多态——virtual

    作用:解决当使用基类的指针指向派生类的对象并调用派生类中与基类同名的成员函数时会出错(只能访问到基类中的同名的成员函数)的问题,从而实现运行过程的多态 不加virtual #include<io ...

  6. iOS常用宏定义大全

    宏定义与常量的区别 宏:只是在预处理器里进行文本替换,不做任何类型检查,宏能定义代码,const不能,多个宏编译时间相对较长,影响开发效率,调试过慢,const只会编译一次,缩短编译时间. 所以在使用 ...

  7. [LeetCode] 15. 3Sum ☆☆☆(3数和为0)

    描述 Given an array nums of n integers, are there elements a, b, c in nums such that a + b + c = 0? Fi ...

  8. 利用jenkens+github实现简单的CI/CD

    一  获取github accessToken 依次点击 settings----> Developer settings --->Personal access tokens  到这里如 ...

  9. swoole| swoole 协程初体验 转

    swoole| swoole 协程初体验   date: 2018-5-30 14:31:38title: swoole| swoole 协程初体验description: 通过协程的执行初窥 swo ...

  10. sql sever 查询用户所有的表和各个表数据量

    和oracle有区别, 需要关联表 SELECT A.NAME ,B.ROWS  FROM sysobjects  A JOIN sysindexes B ON A.id = B.id WHERE A ...