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. 使用Genymotion调试出现错误INSTALL_FAILED_CPU_ABI_INCOMPATIBLE解决的方法

    今天在使用android studio在Genymotion上调试程序出现INSTALL_FAILED_CPU_ABI_INCOMPATIBLE导致程序安装不了: 后来百度发现是要安装:http:// ...

  2. wx.request的并发问题

    wepyjs - 小程序组件化开发框架 https://tencent.github.io/wepy/document.html#/ 在同时并发10个request请求测试时: 不使用WePY: 使用 ...

  3. 搭建双系统后没有windows的引导程序

    因为安装linux系统前没有安装引导程序,导致安装了linux系统后进入linux系统没有windows的引导程序,网上找了很多解决办法,也不能说是不好使,只是作为新手小白来说有点难以理解,最后无意中 ...

  4. js 时间戳精确值的问题

    最近做一个多图上传的功能,通过name + 时间戳命名,结果发现时间戳竟然一样,一直以为是代码逻辑的问题,结果出错在时间戳的获取上了. 关于时间戳的获取方式: 1.Date.parse() var d ...

  5. 一个简单的servlet

    1.创建一个自己的servlet文件,继承HttpServlet MyServlet.java package com.jmu.ccjoin.controller; import java.io.IO ...

  6. UVA11624 Fire! —— BFS

    题目链接:https://vjudge.net/problem/UVA-11624 题解: 坑点:“portions of the maze havecaught on fire”, 表明了起火点不唯 ...

  7. uptime详解，最通俗的说明了cpu平均负载

    今天又个网友问uptime的三个平均负载值具体要怎么理解,发现要自己解释还真不知道怎么表达~~~~,下面到网上找了篇文章给大家分享:   uptime命令,有两大用处,一个是看您的机器的运行时间,另一 ...

  8. AndroidStudio——Android SDK

    前言 安卓的SDK包,跨过长城下载好的,分享出来一下~ Android Studio版本 | 3.4.1 下载地址 微云下载地址 | 链接:https://share.weiyun.com/5rm6l ...

  9. codeforces 441B. Valera and Fruits 解题报告

    题目链接:http://codeforces.com/problemset/problem/441/B 题目意思:有 n 棵fruit trees,每课水果树有两个参数描述:水果成熟的时间和这棵树上水 ...

  10. Java经典算法大全

    1.河内之塔.. 2.Algorithm Gossip: 费式数列. 3. 巴斯卡三角形 4.Algorithm Gossip: 三色棋 5.Algorithm Gossip: 老鼠走迷官(一) 6. ...