server

from flask import Flask, request, render_template

from geventwebsocket.handler import WebSocketHandler

from gevent.pywsgi import WSGIServer

from geventwebsocket.websocket import WebSocket

import json

app = Flask(__name__)

user_socket_dict = {}  # 字典

@app.route('/conn_ws/<user_nick>')  #http 协议,

def ws_app(user_nick):

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

    user_socket_dict[user_nick] = user_socket  # { 昵称:user信息 }

    print(len(user_socket_dict), list(user_socket_dict.keys()))

    while True:    # user_socket 是一个内存地址

        msg =  user_socket.receive()  #  hang 住了

        msg_dict = json.loads(msg)

        to_user = msg_dict.get('to_user')

        if to_user == 'all':

            for ss in list(user_socket_dict.values()):

                ss.send(msg)

        else:

            to_user_socket =  user_socket_dict.get(to_user)

            to_user_socket.send(msg)

@app.route('/')

def index():

    return render_template('my_ws.html')

if __name__ == '__main__':

    # app.run()

    http_ser = WSGIServer(('0.0.0.0',9009),app,handler_class=WebSocketHandler)  # 应用程序网关接口

    http_ser.serve_forever()

页面 html

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>单聊</title>

</head>

<body>

<p><input type="text" id="nick">

    <button onclick="login()">登陆聊天室</button>

</p>

发送给: <input type="text" id="to_user" placeholder="找谁聊?"> 消息: <input type="text" id="send_str">

<button id="sin_btn" onclick="sin_send()">发消息</button>

<button id="send_btn" onclick="send()">群聊发消息</button>

<p>

<div id="chat_list">

</div>

</p>

</body>

<script type="text/javascript">

    var ws = null;  //公共变量,

    function login() {

        var nick = document.getElementById('nick').value;

        ws = new WebSocket('ws://192.168.11.94:9009/conn_ws/' + 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,

            to_user: 'all',   // 群聊

            message: message

        };

        var json_str = JSON.stringify(send_str);

        ws.send(json_str);

    }

    function sin_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_str = JSON.stringify(send_str);

        ws.send(json_str);

    }

    // js代码是异步代码;

</script>

</html>

websocket 二合一的更多相关文章

  1. 【老司机经验】CC2530&STM8S105二合一嵌入式学习板设计思路与经验分享

    CC2530&STM8S105二合一嵌入式学习板设计思路与经验分享 1.缘起    这些年来一直在其他公司的实验箱和别人的开发板上进行教学与开发工作,总是觉得功能设计不那么合意.心里突然冒出个 ...

  2. mobile_轮播图_transform 版本_transform 读写二合一

    轮播图_transform 版本 关键点: 2D 变换 transform 不会改变 元素 在 文档流 中的位置 定位 position 会改变 元素 在 文档流 中的位置 语句解析太快,使用 set ...

  3. 插入数据返回自增id及插入更新二合一

    原文https://blog.csdn.net/dumzp13/article/details/50984413 JDBC: con.setAutoCommit(false); String sql ...

  4. 【洛谷2468】[SDOI2010] 粟粟的书架（二合一）

    点此看题面 大致题意: 问你选取一个矩形区间内至少几个数,才能使它们的和\(\ge H_i\). 二合一 根据数据范围,比较显然能看出它是一道二合一的题目. 对于第一种情况,\(R,C\le 200\ ...

  5. 一步一步学WebSocket(二) 使用SuperWebSocket实现自己的服务端

    上一篇文章,我们了解了客户端如何与服务器创建WebSocket连接.但是一个巴掌拍不响,既然是通信,就必然最少要有两个端.今天我们来看看c#如何用已有的框架实现一个WebSocket服务端. 在.Ne ...

  6. 学习WebSocket(二):使用Spring WebSocket做一个简单聊天室

    聊天室高频率.低延时完全符合websocket的特点,所以聊天室使用websocket再适合不过了. 聊天室的功能并没有比上一节代码多多少,主要在握手阶段对用户的session做处理,对用户的消息进行 ...

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

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

  8. websocket(二)——基于node js 的同步聊天应用

      https://github.com/sitegui/nodejs-websocket 1.用node搭建本地服务 npm install nodejs-websocket var ws = re ...

  9. 注册登录二合一之bootstrap

    来源 https://bootsnipp.com/snippets/featured/login-and-register-tabbed-form jquery插件 需导入bootstrap插件 这个 ...

随机推荐

  1. 自己动手实现RPC

    一.需求:用户管理系统(UMS),仓库管理系统(WMS),订单管理系统(OMS) 现在OMS有一张订单表:[订单id,用户id,商品id,订单状态,订单时间],需要在客户端展示此订单对应的用户详情和商 ...

  2. 转载：margin外边距合并问题以及解决方式

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. E - BD String

    众所周知,度度熊喜欢的字符只有两个:B和D. 今天,它发明了一种用B和D组成字符串的规则: S(1)=B S(2)=BBD S(3)=BBDBBDD - S(n)=S(n−1)+B+reverse(f ...

  4. javascript面试题（2）

    可以参考一  https://www.cnblogs.com/DCL1314/p/7903114.html 1.什么是JavaScript?(这是基本题,对很多程序员来说也是送分题!) JavaScr ...

  5. hdu2074 叠筐

    叠筐 Time Limit: 1000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)Total Submissi ...

  6. package.json文件配置信息

    1.概述 每个项目的根目录下面,一般都有一个package.json文件,定义了这个项目所需要的各种模块,以及项目的配置信息(比如名称.版本.许可证等元数据).npm install命令根据这个配置文 ...

  7. 关于vue-cli创建项目（小白）

    vue-cli,都说是vue脚手架,一般cli是命令行的意思,一看就知道与node有关,其实脚手架是建筑工用的工具,给工人踩在上面干活的,这里借用它的意思,我觉得应该叫vue平台工具大家更容易懂,毕竟 ...

  8. mysql数据库数据的 备份以及还原

    数据库备份的3种方式: 例如:mysqldump -uzx_root -p test>/root/test1.sql

  9. SQL中什么时候需要使用游标？使用游标的步骤

    https://zhidao.baidu.com/question/568932670.html 例子table1结构如下id intname varchar(50) declare @id intd ...

  10. Gym 101981I - Magic Potion - [最大流][2018-2019 ACM-ICPC Asia Nanjing Regional Contest Problem I]

    题目链接:http://codeforces.com/gym/101981/attachments There are n heroes and m monsters living in an isl ...