目录结构：

# -*- coding:utf-8 -*-

import uuid

import json

import tornado.ioloop

import tornado.web

import tornado.websocket

class IndexHandler(tornado.web.RequestHandler):

    def get(self):

        self.render('index.html')

class ChatHandler(tornado.websocket.WebSocketHandler):

    # 用户存储当前聊天室用户

    waiters = set()

    # 用于存储历时消息

    messages = []

    def open(self):

        """

        客户端连接成功时，自动执行

        :return:

        """

        ChatHandler.waiters.add(self)

        uid = str(uuid.uuid4())

        self.write_message(uid)

        for msg in ChatHandler.messages:

            content = self.render_string('message.html', **msg)

            self.write_message(content)

    def on_message(self, message):

        """

        客户端连发送消息时，自动执行

        :param message:

        :return:

        """

        msg = json.loads(message)

        ChatHandler.messages.append(msg)

        for client in ChatHandler.waiters:

            content = client.render_string('message.html', **msg)

            client.write_message(content)

    def on_close(self):

        """

        客户端关闭连接时，，自动执行

        :return:

        """

        ChatHandler.waiters.remove(self)

def run():

    settings = {

        'template_path': 'templates',

        'static_path': 'static',

    }

    application = tornado.web.Application([

        (r"/", IndexHandler),

        (r"/chat", ChatHandler),

    ], **settings)

    application.listen(8888,address='0.0.0.0')

    tornado.ioloop.IOLoop.instance().start()

if __name__ == "__main__":

    run()
<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Python聊天室</title>

</head>

<body>

    <div>

        <input type="text" id="txt"/>

        <input type="button" id="btn" value="提交" onclick="sendMsg();"/>

        <input type="button" id="close" value="关闭连接" onclick="closeConn();"/>

    </div>

    <div id="container" style="border: 1px solid #dddddd;margin: 20px;min-height: 500px;">

    </div>

    <script src="/static/jquery-2.1.4.min.js"></script>

    <script type="text/javascript">

        $(function () {

            wsUpdater.start();

        });

        var wsUpdater = {

            socket: null,

            uid: null,

            start: function() {

                var url = "ws://192.168.20.200:8888/chat";

                wsUpdater.socket = new WebSocket(url);

                wsUpdater.socket.onmessage = function(event) {

                    if(wsUpdater.uid){

                        wsUpdater.showMessage(event.data);

                    }else{

                        wsUpdater.uid = event.data;

                    }

                }

            },

            showMessage: function(content) {

                $('#container').append(content);

            }

        };

        function sendMsg() {

            var msg = {

                uid: wsUpdater.uid,

                message: $("#txt").val()

            };

            wsUpdater.socket.send(JSON.stringify(msg));
　　　　　　　$("#txt").val("")

        }

</script>

</body>

</html>
<div style="border: 1px solid #dddddd;margin: 10px;">

    <div>游客{{uid}}</div>

    <div style="margin-left: 20px;">{{message}}</div>

</div>

基于tornado实现的web聊天室的更多相关文章

  1. 基于websocket实现的web聊天室

    # -*- coding:utf-8 -*- import socket import base64 import hashlib def get_headers(data): "" ...

  2. WebSocket请求过程分析及实现Web聊天室

    WebSocket协议是基于TCP的一种新的协议.WebSocket最初在HTML5规范中被引用为TCP连接,作为基于TCP的套接字API的占位符.它实现了浏览器与服务器全双工(full-duplex ...

  3. 基于Server-Sent Event的简单聊天室　Web 2.0时代，即时通信已经成为必不可少的网站功能，那实现Web即时通信的机制有哪些呢？在这门项目课中我们将一一介绍。最后我们将会实现一个基于Server-Sent Event和Flask简单的在线聊天室。

    基于Server-Sent Event的简单聊天室 Web 2.0时代,即时通信已经成为必不可少的网站功能,那实现Web即时通信的机制有哪些呢?在这门项目课中我们将一一介绍.最后我们将会实现一个基于S ...

  4. 基于Node.js+socket.IO创建的Web聊天室

    这段时间进了一个新的项目组,项目是用Appcan来做一个跨平台的移动运维系统,其中前台和后台之间本来是打算用WebSocket来实现的,但写好了示例后发现android不支持WebSocket,大为受 ...

  5. 基于Node的Web聊天室

    1 项目名称 Web聊天室(<这是NodeJs实战>第二章的一个案例,把整个开发过程记录下来)

  6. ASP.NET SignalR 与 LayIM2.0 配合轻松实现Web聊天室（十二） 代码重构使用反射工厂解耦（一）缓存切换

    前言 上一篇中,我们用了反射工厂来解除BLL和UI层耦合的问题.当然那是最简单的解决方法,再复杂一点的程序可能思路相同,但是在编程细节中需要考虑的就更多了,比如今天我在重构过程中遇到的问题.也是接下来 ...

  7. ASP.NET SignalR 与 LayIM2.0 配合轻松实现Web聊天室（四） 之 用户搜索（Elasticsearch），加好友流程（1）。

    前面几篇基本已经实现了大部分即时通讯功能:聊天,群聊,发送文件,图片,消息.不过这些业务都是比较粗犷的.下面我们就把业务细化,之前用的是死数据,那我们就从加好友开始吧.加好友,首先你得知道你要加谁.L ...

  8. ASP.NET SignalR 与 LayIM2.0 配合轻松实现Web聊天室（七） 之 历史记录查询（时间，关键字，图片，文件），关键字高亮显示。

    前言 上一篇讲解了如何自定义右键菜单,都是前端的内容,本篇内容就一个:查询.聊天历史纪录查询,在之前介绍查找好友的那篇博客里已经提到过 Elasticsearch,今天它又要上场了.对于Elastic ...

  9. .net core下使用FastHttpApi构建web聊天室

    一般在dotnet core下构建使用web服务应用都使用asp.net core,但通过FastHttpApi组建也可以方便地构建web服务应用,在FastHttpApi功能的支持下构建多人聊天室是 ...

随机推荐

  1. 用Javascript实现图片的缓慢缩放效果

    <body> <!--页面布局:一张图片两个按钮--> <div style = "width:400px;margin:0 auto"> &l ...

  2. 关闭chrome浏览器的input香蕉黄背景

    chrome浏览器input的自动完成,点击之后自动输入,input的背景会变成香蕉黄,用如下方法修复: /* Change the white to any color ;) 就是给input设置内 ...

  3. element-ui 的input组件 @keyup.enter事件的添加办法

    <el-input placeholder="请输入密码" type="password" @keyup.enter.native="login ...

  4. hdu 3501 容斥原理或欧拉函数

    Calculation 2 Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)Tot ...

  5. 洛谷 P 1387 最大正方形

    题目描述 在一个n*m的只包含0和1的矩阵里找出一个不包含0的最大正方形,输出边长. 输入输出格式 输入格式: 输入文件第一行为两个整数n,m(1<=n,m<=100),接下来n行,每行m ...

  6. 【BZOJ4945&&UOJ317】游戏（2-sat，拓扑序）

    题意: 思路: 输出方案时有一个优秀的性质可以利用: tarjan缩点之后点所属的分量编号是原图的反的拓扑序 所以只需要在两种方案内找到所属分量编号较小的那个就行了,用来满足(i,i')那个限制 #i ...

  7. 44深入理解C指针之---指针安全

    一.指针安全:指针的声明和初始化问题 1.指针不恰当的声明: 1).声明的意思和真是的意图不一致,可以通过格式搞定: 2).使用宏定义时,展开的含义有变,通过格式搞定: 3).使用类型定义,使用更加方 ...

  8. java mail Received fatal alert: handshake_failure java 无法发送邮件问题 java 发送qq邮件（含源码）

     java 无法发送邮件问题 java 发送qq邮件 报错:java mail Received fatal alert: handshake_failure (使用ssl) javax.mail.M ...

  9. [转载][FPGA]Quartus代码保护-生成网表文件

    0. 简介 当项目过程中,不想给甲方源码时,该如何?我们可以用网表文件qxp或者vqm对资源进行保护. 下面讲解这两个文件的具体生成步骤: 1. 基本概念 QuartusII的qxp文件为Quartu ...

  10. DNS入门（转）

    转自:阮一峰的网络日志 作者: 阮一峰 DNS 是互联网核心协议之一.不管是上网浏览,还是编程开发,都需要了解一点它的知识. 本文详细介绍DNS的原理,以及如何运用工具软件观察它的运作.我的目标是,读 ...