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. Linux------使用Xfpt6连接阿里云ECS服务器

    1.安装Xftp6,直接下一步到安装完成就可以了 2.新建文件传输 3.新建会话 4.填写会话信息 5.点击“连接”即可

  2. 【译】Apache Kafka支持单集群20万分区

    之前网上关于确定Kafka分区数的博客多多少少都源自于饶军大神的文章,如今他带来了这方面的第二篇文章,特此翻译一下,记录一下其中的要点. 原贴地址: https://www.confluent.io/ ...

  3. 配置非安装版tomcat服务

    1.设置服务名称,进入tomcat目录/bin文件夹,编辑service.bat中的 set SERVICE_NAME = (修改成你需要的服务名,这个将是你启动服务的句柄): 2.修改 set PR ...

  4. react 使用hooks

    react hooks文档 λ yarn add react@16.7.0-alpha.2 λ yarn add react-dom@16.7.0-alpha.2 设置 state import Re ...

  5. Maven项目出现Perhaps you are running on a JRE rather than a JDK?

    今天   换了一个IDE  然后 运行 maven的时候 报了一个 这个 错误 我记得以前 我遇到过   所以 把解决方法 记下来吧 原因 maven插件需要使用jdk 的  但是 eclipse默认 ...

  6. python 写入Excel

     一.安装xlrd模块: 1.mac下打开终端输入命令: pip install XlsxWriter 2.验证安装是否成功: 在mac终端输入 python  进入python环境 然后输入 imp ...

  7. css 使元素居中

    css使元素水平居中 1.对于行内元素的水平居中 给父元素设置text-align:center <div style="text-align:center;">居中显 ...

  8. jsonp 的实质

    发送 get请求,可以通过 浏览器输入 url地址,也可以在 javascript 脚本中手动发送 ajax. 或者也可以在 Html网页中定义一个 带 src的 Html 标签,比如 <img ...

  9. JQuery each遍历A标签获取href 和 里面指定的值

    JQuery each遍历A标签获取href $('.scol_subject').each(function(){ var href = $(this).attr('href'); $(this). ...

  10. phjp(ajax）作用知识点

    1.url: 要求为String类型的参数,(默认为当前页地址)发送请求的地址. 2.type: 要求为String类型的参数,请求方式(post或get)默认为get.注意其他http请求方法,例如 ...