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_template

app = Flask(__name__)

user_socket_list = []  # 存放所有链接到服务器的 socket

@app.route("/ws")

def my_websocket_func():

    # 获取到websocket链接.

    user_socket = request.environ.get("wsgi.websocket")  # type:WebSocket

    user_socket_list.append(user_socket)    # 每个链接上来的socket都存放到 socket列表中一份

    while 1:

        msg = user_socket.receive()  # 通过连接等待接收客户端发送过来的消息

        for us in user_socket_list:

            # if us == user_socket:       # 当循环到的socket链接是自己的时候

            #     continue

            try:

                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.data

        var 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>

WebSocket 实现链接 群聊(low low low 版本)的更多相关文章

  1. 【Java分享客栈】SpringBoot整合WebSocket+Stomp搭建群聊项目

    前言 前两周经常有大学生小伙伴私信给我,问我可否有偿提供毕设帮助,我说暂时没有这个打算,因为工作实在太忙,现阶段无法投入到这样的领域内,其中有两个小伙伴又问到我websocket该怎么使用,想给自己的 ...

  2. websocket学习和群聊实现

    WebSocket协议可以实现前后端全双工通信,从而取代浪费资源的长轮询.在此协议的基础上,可以实现前后端数据.多端数据,真正的实时响应.在学习WebSocket的过程中,实现了一个简化版群聊,过程和 ...

  3. 基于websocket搭建简易群聊

    1.前端HTML <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset=&qu ...

  4. Flask 实现 WebSocket 通讯---群聊和私聊

    一.WebSocket介绍 WebSocket是一种在单个TCP连接实现了服务端和客户端进行双向文本或二进制数据通信的一种通信的协议. WebSocket使得客户端和服务器之间的数据交换变得更加简单, ...

  5. websocket实现群聊

    server # @File: 群聊 from flask import Flask, render_template, request from geventwebsocket.handler im ...

  6. 一例完整的websocket实现群聊demo

    前言 业余我都会花一些时间在tcp.http和websocket等领域的学习,现在觉得有点收获,所以把一个基于websocket的群聊功能的例子提供给大家玩玩.当然这是一个很完整的例子,包括webso ...

  7. websocket(二)--简单实现网页版群聊

    websocket可以实现服务端的消息推送,而不必在客户端轮询,大大的节省的资源,对于实时通讯来说简直是个大喜讯. 在上一篇文章中介绍了协议握手,这篇文章将通过实现简单的群聊来帮助进一步了解webso ...

  8. WebSocket群聊与单聊

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

  9. WebSocket刨根问底(三)之群聊

    前两篇文章[WebSocket刨根问底(一)][WebSocket刨根问底(二)]我们介绍了WebSocket的一些基本理论,以及一个简单的案例,那么今天继续,我们来看一个简单的群聊的案例,来进一步了 ...

随机推荐

  1. [译] iOS 11.4.1 Beta：全新的USB限制模式

    (Source/原文链接 https://blog.elcomsoft.com/2018/06/ios-11-4-1-beta-usb-restricted-mode-has-arrived/) 作者 ...

  2. C#学习-图解教程(1)：格式化数字字符串

    学习内容:C#:学习书籍:图解教程(中文第四版). 目录:第二章 C#编程概述 -----> 2.7 从程序中输出文本 -----> 2.7.5格式化数字字符串 using System; ...

  3. mysql免解压版安装教程步骤

    首先我这里演示的是mysql-5.6.27-winx64这个免解压的版本 添加环境变量(如添加了则跳过该步骤) 操作如下: )右键单击我的电脑->属性->高级系统设置(高级)->环境 ...

  4. Java高级框架------Spring（二）

    五．如何给Bean的属性赋值(注入) 1. 通过构造方法来赋值 2. 设置注入(通过set方法) 2.1 如果属性是基本类型或String等简单 <bean id="peo" ...

  5. foreach控制循环if判断

    <c:forEach items="${resultMap}" var="daily" varStatus="n"> <t ...

  6. 微信小程序-滚动Tab选项卡

    前言:今天呢 给大家详细讲解一下滚动Tab选项卡:左右可滑动切换的效果,希望对大家做项目时候有用! 以前也遇到过这个,但是没有做记录.转载来源于:https://www.jianshu.com/p/9 ...

  7. 关于Unsupported major.minor version 52.0解决方案的补充

    参考:https://blog.csdn.net/jingtianyiyi/article/details/80455916 补充: 这个设置比较容易忽略: 在eclipse中新建tomcat或在原有 ...

  8. springboot 问题总结

    一:返回格式化日期 如果我们是用fastjson处理成jsonString,可以通过下面两种方式处理 1,在接受实体上@JSONField(format="yyyy-MM-dd HH:mm: ...

  9. php中一个"异类"语法： $a && $b = $c; 【转载】

    $a = 1;$b = 2;$c = 3;$a && $b = $c;echo "a:$a";echo "b:$b";echo "c: ...

  10. C# 面试知识点网络文档整理

    一 C# .NET技术 1.ASP.NET MVC如何控制权限? 2.C#.NET中的CTS.CLS和CLR? 3.什么是多线程,如何创建和如何使用?请写一个多线程单例模式? 4.什么是单例模式? 5 ...