python+websocket匿名聊天室实现

疫情期间,先来无事,鼓捣些小玩意,本次介绍下python匿名聊天室实现
1.看效果


实现起始比较简单,主要是使用websocke实现前后端通信而已:
先看下前端代码:

 <script>
        var socket = new WebSocket("ws://192.168.96.128:5000/message");
        socket.onmessage = function (event) {
            try {
                message = JSON.parse(event.data)
                if (message["mine"] == true) {
                    chat_mine()
                } else {
                    chat_other()
                }
                if (message["type"] == "login" ||
                    message["type"] == "logout") {
                    insertHTML = "<div class='sys'>" +
                        "<span id='bsay'>" + message["text"] + "</span></div>"
                    $(".talk_show").append(insertHTML)
                }
            } catch (e) {
                console.log(e)
                console.log(event)
            }
        };

        function chat_mine() {
            if (message["type"] == "chat") {
                insertHTML = "<div class='btalk'>" +
                    "<span id='bsay'>" + message["ip"] + "-" + message["time"] + ":<br>" + message["text"] + "</span></div>"
                $(".talk_show").append(insertHTML)
            }
        }

        function chat_other() {
            if (message["type"] == "chat") {
                insertHTML = "<div class='atalk'><span id='asay'>" + message["ip"] + "-" + message["time"] + ":<br>" + message["text"] + "</span></div>"
                console.log(insertHTML)
                $(".talk_show").append(insertHTML)
            }
        }

        $(function () {
            $("#talksub").click(function () {
                //展示信息在屏幕上
                message = $("#talkwords").val()
                socket.send(message)
                $("#talkwords").val("")
            })
        })

        function InputPress() {
            if (event.keyCode == 13) {
                message = $("#talkwords").val()
                socket.send(message)
                $("#talkwords").val("")
            }
        }
    </script>

后端处理websocker消息的代码

#!/usr/bin/env python
# -*- coding:utf-8 -*-

from tornado.websocket import WebSocketHandler
from tornado.web import RequestHandler
import logging
import sys
import datetime
import json

clients = dict()

LOG_FORMAT = "%(asctime)s - %(levelname)s - %(message)s"
logging.basicConfig(level=logging.INFO, stream=sys.stdout, format=LOG_FORMAT)


class ChatHandler(WebSocketHandler):
    def open(self):
        # 获取客户端IP信息
        self.id = self.request.remote_ip
        # 如果链接加入,
        clients[self.id] = {"id": self.id, "object": self}
        logging.info("客户端[%s]加入聊天室", self.request.remote_ip)
        # 消息通知各个客户端,某个IP客户端加入聊天室
        for client in clients.values():
            client['object'].write_message(self.package_message(client["id"], "login", "客户端[%s]登录聊天室" % self.id))
        pass

    # 处理接收的消息
    def on_message(self, data):
        logging.info("客户端[%s]说[%s]", self.request.remote_ip, data)
        # 服务端接受到消息,转发消息到其余客户端
        for client in clients.values():
            client['object'].write_message(self.package_message(client["id"], "chat", data))
        pass

    def data_received(self, chunk: bytes):
        print(str(chunk, encoding="utf-8"))
        pass

    def on_close(self):
        if self.id in clients:
            del clients[self.id]
            # 消息通知各个客户端,某个IP客户端加入聊天室
        for client in clients.values():
            client['object'].write_message(self.package_message(client["id"], "logout", "客户端[%s]退出聊天室" % self.id))
        pass

    def check_origin(self, origin):
        return True  # 允许WebSocket的跨域请求

    # 通信消息组装
    def package_message(self, ip, type, content):
        message = dict()
        message["type"] = type
        message["ip"] = self.id
        message["time"] = datetime.datetime.now().strftime("%H:%M:%S")
        message["text"] = content
        message["mine"] = self.id == ip
        return message


class IndexHandler(RequestHandler):
    def get(self):
        self.render("index.html")

当前这个版本还是比较简易的,还需要进行优化,不过能够反映大致的思路

线上演示地址如下:
http://182.92.152.248:5000/
登录聊天室回复:源码 返回源码地址