server
# @File: ws

from flask import Flask, request, render_template

from geventwebsocket.handler import WebSocketHandler

from geventwebsocket.websocket import WebSocket  # 我用来做语法提示

from gevent.pywsgi import WSGIServer

import json

app = Flask(__name__)  # type:Flask

# 存放用户对应的，收件人，发件人，以及信息

# 可以做聊天室   {聊天室id:[], 聊天室id:[]...}

# 两个用户之间的聊天{"用户名":{信息}, "用户名":{信息}}

user_socket_dict = {}  # type:dict

@app.route('/')

def index():

    return render_template('single.html')

@app.route("/ws/<user>")

def ws(user):

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

    if user_socket:

        user_socket_dict[user] = user_socket

    print(len(user_socket_dict), user_socket_dict)

    while 1:

        msg = user_socket.receive()

        print(msg)  # b"{from_user:xx, to_user:xx,msg:xx}"

        msg_dict = json.loads(msg)

        to_usocket = user_socket_dict.get(msg_dict.get("to_user"))  # type:WebSocket

        to_usocket.send(json.dumps({"from_user": user, "to_user": msg_dict.get("to_user"), "msg": msg_dict.get("msg")}))

if __name__ == '__main__':

    http_server = WSGIServer(("0.0.0.0", 5000), app, handler_class=WebSocketHandler)

    http_server.serve_forever()
single.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</title>

</head>

<body>

<p>您的昵称：<input type="text" id="nick">

    <button onclick="openws()">进入聊天室</button>

</p>

<p>给<input type="text" id="to_user">发送：<input type="text" id="message">

    <button onclick="send_msg()">发送消息</button>

</p>

<div id="msg_list" style="width: 500px;">

</div>

</body>

<script type="application/javascript">

    var ws = null;

    // ws.onopen = function(){

    //   alert("欢迎来到S14群喷");

    // };

    function openws() {

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

        ws = new WebSocket("ws://192.168.12.41:5000/ws/" + nick);

        ws.onmessage = function (ws_status) {

            console.log(ws_status.data);

            var msg_obj = JSON.parse(ws_status.data);

            var ptag = document.createElement("p");

            ptag.innerText = msg_obj.from_user + " : " + msg_obj.msg;

            document.getElementById("msg_list").appendChild(ptag);

        };

    }

    function send_msg() {

        var msg = document.getElementById("message").value;

        var from_user = document.getElementById("nick").value;

        var to_user = document.getElementById("to_user").value;

        var ptag = document.createElement("p");

        ptag.style.cssText = "text-align: right;";

        ptag.innerText = msg + " : " + from_user;

        document.getElementById("msg_list").appendChild(ptag);

        var msg_obj = {

            msg: msg,

            from_user: from_user,

            to_user: to_user

        };

        ws.send(JSON.stringify(msg_obj));

    };

</script>

</html>

websocket实现单聊的更多相关文章

  1. websocket 实现单聊群聊 以及 握手原理+加密方式

    WebSocket 开始代码 服务端 群聊 # type:WebSocket 给变量标注类型 # websocket web + socket from geventwebsocket.server ...

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

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

  3. 基于websocket的单聊.群聊

    关于ai.baidu.com的 代码: #########################################核心代码################################### ...

  4. 使用websocket实现单聊和多聊

    单聊: 前端: <!DOCTYPE html> <html lang="zh-CN"> <head> <meta http-equiv=& ...

  5. WebSocket群聊与单聊

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

  6. websocket 群聊单聊

    websocket 介绍 介绍引自 https://segmentfault.com/a/1190000012709475 群聊 from flask import Flask, request, r ...

  7. websocket 群聊,单聊,加密,解密

    群聊 from flask import Flask, request, render_templatefrom geventwebsocket.handler import WebSocketHan ...

  8. Websocket实现群聊、单聊

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

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

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

随机推荐

  1. 简单的glib测试(三)

    #include <stdlib.h> #include <stdio.h> #include <string.h> #include <locale.h&g ...

  2. 你的以太网速度足够快吗？四种更快的速度正在路上&#183;&#183;&#183;&#183;&#183;&#183;

    以太网的未来将远远超越下一个最快速度:为无处不在的网络协议绘制路径的网络project师们正在寻找新版本号来服务于各种应用程序. 在上周六的以太网联盟(一个行业组织,用于促进IEEE以太网标准)会议上 ...

  3. 序列化模块 json pickel shelve

    一.json  模块 1.定义 将字典.列表等内容转换成字符串的过程就是序列化. 操作的数据类型有限,但是可以支持所有编程语言操作. 2.为什么要有序列化? 1.以某种存储形式使自定义对象持久化. 2 ...

  4. MapReduce算法形式二：去重（HashSet）

    案例二:去重(shuffle/HashSet等方法)shuffle主要针对的是key去重HashSet主要针对values去重

  5. webdriver.close() quit() 批量kill进程 内存耗尽的解决办法

    问题现象: shell窗口卡,换IP的登录窗,不开: 猜测: 内存耗尽 spider_url,py driver = webdriver.PhantomJS( executable_path='/us ...

  6. iOS中城市定位功能的实现

    引入框架:CoreLocation .h文件 引入CoreLocation/CoreLocation.h @interface WeatherViewController :UIViewControl ...

  7. 恢复MySQL数据库删除的数据

    在日常运维工作中,对于数据库的备份是至关重要的!数据库对于网站的重要性使得我们对 MySQL 数据库的管理不容有失!然而是人总难免会犯错误,说不定哪天大脑短路了,误操作把数据库给删除了,怎么办? 下面 ...

  8. eureka-注册中心使用密码验证

    spring cloud 1.1 版本之后可以使用 配置文件: bootstrap.yml server.port: 9000 spring.application.name: registry eu ...

  9. bzoj3727: PA2014 Final Zadanie

    我真是SB之神呢这么SB的题都不会 肯定是先无脑正向思考,罗列下关系式: b[1]=∑a[i]*dep[i]=∑tot[i] (i!=1) b[i]=b[fa]-tot[i]+(tot[1]-tot[ ...

  10. jsorder 第三方修改版 修正bug 增加总价

    我主要运用这个jsorder,修正了它的不足//1.0版本bug:刷新页面 无法增加或者删除原来添加的商品//1.1版本:修正了1.0版本  新增bug 能够修改原来的商品 但出现产品数量为0 仍然保 ...