tornado中的 websocket 创建聊天室

版权声明:本文为博主原创文章,遵循 CC 4.0 by-sa 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/YHP_DANIEL/article/details/82390009

WebSocket是HTML5规范中新提出的客户端-服务器通讯协议,协议本身使用新的ws://URL格式。

WebSocket 是独立的、创建在 TCP 上的协议,和 HTTP 的唯一关联是使用 HTTP 协议的101状态码进行协议切换,使用的 TCP 端口是80,可以用于绕过大多数防火墙的限制。

WebSocket 使得客户端和服务器之间的数据交换变得更加简单,允许服务端直接向客户端推送数据而不需要客户端进行请求,两者之间可以创建持久性的连接,并允许数据进行双向传送。

目前常见的浏览器如 Chrome、IE、Firefox、Safari、Opera 等都支持 WebSocket,同时需要服务端程序支持 WebSocket
Tornado提供支持WebSocket的模块是tornado.websocket,其中提供了一个WebSocketHandler类用来处理通讯。

WebSocketHandler.open() 当一个WebSocket连接建立后被调用。

WebSocketHandler.on_message(message) 当客户端发送消息message过来时被调用,注意此方法必须被重写。

WebSocketHandler.on_close() 当WebSocket连接关闭后被调用。

WebSocketHandler.write_message(message, binary=False) 向客户端发送消息messagea,message可以是字符串或字典(字典会被转为json字符串)。若binary为False,则message以utf8编码发送;二进制模式(binary=True)时,可发送任何字节码。

WebSocketHandler.close() 关闭WebSocket连接。

WebSocketHandler.check_origin(origin) 判断源origin,对于符合条件(返回判断结果为True)的请求源origin允许其连接,否则返回403。可以重写此方法来解决WebSocket的跨域请求(如始终return True)。
所以利用tornado中的websocket我们先创建一个简单的聊天室
一、创建函数:

import os
import datetime
from tornado.ioloop import IOLoop
from tornado.websocket import WebSocketHandler
from tornado.web import Application,RequestHandler
class IndexHandler(RequestHandler):
    def get(self, *args, **kwargs):
        self.render('chat.html')
userList = set()
class ChatHandlder(WebSocketHandler):
    def open(self, *args, **kwargs):
        userList.add(self)
        [user.write_message(u'%s--%s上线了~'%(self.request.remote_ip,datetime.datetime.now().strftime('%Y-%m-%d %H:%M:%S')))for user in userList]
    def on_message(self, message):
        [user.write_message(u'%s-%s说:%s'%(self.request.remote_ip,datetime.datetime.now().strftime('%Y-%m-%d %H:%M:%S'),message))for user in userList]
    def on_close(self):
        userList.remove(self)
        [user.write_message(u'%s-%s下线啦~'%(self.request.remote_ip,datetime.datetime.now().strftime('%Y-%m-%d %H:%M:%S')))for user in userList]
app = Application([
    (r'^/$',IndexHandler),
    (r'^/chat/',ChatHandlder)
],template_path=os.path.join(os.getcwd(),'templates'))

app.listen(8888,address='192.168.1.148')

IOLoop.current().start()
二、创建页面(因为只是简单的实现聊天室功能,所以前端页面布局非常简单,如果想追求完美,可以优化前端页面)
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script type="text/javascript" src="https://cdn.staticfile.org/jquery/1.11.2/jquery.min.js"></script>

    <style>
        #divId{
            width:500px;
            height:300px;
            overflow: auto;
            border:1px solid gray;
            background:lightblue;
        }
        #msg{
            width:400px;
            height: 40px;
            font-size: 30px;
        }
        #Btn{
            width:100px;
            height:45px;

        }
    </style>
</head>
<body>
    <div id="divId"></div>
    <input type="text" id="msg"><input type="button" value="发送" id="Btn" onclick="send()">

    <script>
        var ws = new WebSocket('ws://192.168.1.148:8888/chat/');

        //获取输入的信息,将其添加到div中
        ws.onmessage = function (infor) {
           $('#divId').append('<p>'+infor.data+'<p>')

        };

        function send() {
            var msg = $('#msg').val();
            ws.send(msg);
            $('#msg').val('')
        }
    </script>

</body>
</html>
展开阅读全文

没有更多推荐了,返回首页