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. eclipse创建maven web app

    1 这个功能是由eclipse的插件maven archetype plugin支持的 2 创建过程 File->New->Maven Project 选择archetype为maven- ...

  2. Delphi如何实现多国语言

    Delphi里的多语言处理方法都一样, 都是通过资源DLL的形式进行加载处理. Delphi在加载form数据的时候会判断当前的系统语言,然后根据语言加载不同的资源dll, 来实现多国语言的功能. 下 ...

  3. HDU4280 Island Transport —— 最大流 ISAP算法

    题目链接:https://vjudge.net/problem/HDU-4280 Island Transport Time Limit: 20000/10000 MS (Java/Others)   ...

  4. Android Studio运行出现项目 错误：非法字符：“\ufeff”

    导入项目时,遇到编码问题. 主要原因是: eclipse可以自动把UTF-8+BOM文件转为普通的UTF-8文件,但Android Studio需要重新转换一下编码 解决方法: 将编码格式UTF-8+ ...

  5. Java 通过 HTTP 下载文件

    1. [代码]Download.java   package core.spider; import java.io.*;import java.net.*;import java.util.*; / ...

  6. 书写优雅的shell脚本(插曲) - kill

    shell之kill.killall.xkill.pkill 2013-01-08 22:03:28|  分类: Linux|举报|字号订阅 1 kill kill的应用是和ps 或pgrep 命令结 ...

  7. python startswith和endswith

    startswith判断文本是否以某个或某几个字符开始; endswith判断文本是否以某个或某几个字符结束; text = 'Happy National Day!' print text.star ...

  8. [USACO2006 DEC] Wormholes

    [题目链接] https://www.lydsy.com/JudgeOnline/problem.php?id=1715 [算法] 用SPFA判定负环是否存在即可 时间复杂度 : O(N ^ 2) [ ...

  9. Git如何删除自己创建的项目

    版本管理器第二行最右边,找到倒三角,下面的Edit Project,拖动鼠标到最下面,Remove project ,弹出框Confirmation required里面输入项目名字,如项目名字为“w ...

  10. NOIP前的水题记录

    CF147B Smile House 二分+矩阵快速幂,注意一下储存矩阵相乘结果的矩阵,初始化时,a[i][i]=-inf(而其他都可以a[i][i]=0,为了保证答案的可二分性). CF715B C ...