難的是還是就地用JS顯示出來(lái)相關(guān)的發(fā)布進(jìn)度。

還好，花了一下午實(shí)現(xiàn)了。

可以移植到項(xiàng)目中去羅。。。

websocket.py：

import tornado.ioloop import tornado.web import tornado.websocket from tornado.ioloop import IOLoop from datetime import timedelta import time import os import sys import tornado.httpserverclass WebSocketHandler(tornado.websocket.WebSocketHandler):file_content = ""filename = "test.log"def open(self):passdef update_client(self):self.write_message(self._read_file(self.filename))def on_message(self, message):print messageself.filename = message.split('-')[1]self.update_client()def on_close(self):passdef _read_file(self, filename):print filename, '================='with open(filename) as f:content = f.read()content_diff = content.replace(self.file_content, '')self.file_content = contentreturn content_diffclass IndexPageHandler(tornado.web.RequestHandler):def get(self):self.render("websockets.html")class Application(tornado.web.Application):def __init__(self):handlers = [(r'/', IndexPageHandler),(r'/ws', WebSocketHandler)]settings = dict(template_path=os.path.join(os.path.dirname(__file__), "templates"),static_path=os.path.join(os.path.dirname(__file__), "static"),debug=True)tornado.web.Application.__init__(self, handlers, **settings)if __name__ == '__main__':ws_app = Application()server = tornado.httpserver.HTTPServer(ws_app)server.listen(8888)tornado.ioloop.IOLoop.instance().start()

websocket.html:

<title>Tornado WebSockets</title><link rel="stylesheet" href="/static/uikit-2.22.0/css/uikit.min.css" /> <link rel="stylesheet" href="/static/uikit-2.22.0/css/components/progress.gradient.css"/> <link rel="stylesheet" href="/static/css/radialindicator.css"/> <script src="/static/js/jquery-1.11.2.js"></script> <script src="/static/js/radialIndicator.min.js"></script> <script src="/static/uikit-2.22.0/js/uikit.js"></script> <script src="/static/uikit-2.22.0/js/components/sticky.min.js"></script><div id="procPer"></div> <br> <textarea id="logoutput" cols="100" rows="30" placeholder="日志輸出" style="background:#000; color:#FFF" >...</textarea> <br> <a href="javascript:void(0);" onClick="wsFunc('stop', 'DEMO')"><span id="actionSpn" class="uk-button">停止刷新</span></a> <script>function GetRequest() {var url = location.search;var theRequest = new Object();if (url.indexOf("?") != -1) {var str = url.substr(1);strs = str.split("&");for(var i = 0; i < strs.length; i ++) {theRequest[strs[i].split("=")[0]]=unescape(strs[i].split("=")[1]);}}return theRequest;} var Request = new Object(); Request = GetRequest(); console.log(Request); var dev_version = Request['dev_version']; console.log(dev_version);wsFunc("refresh", dev_version);function wsFunc(msg, dev_version) {var messageContainer = document.getElementById("logoutput");var percentContainer = document.getElementById("procPer");if ("WebSocket" in window) {var ws = new WebSocket("ws://localhost:8888/ws");ws.onopen = function() {};ws.onmessage = function (evt) {messageContainer.innerHTML += evt.data;var d = messageContainer.scrollHeight;messageContainer.scrollTop = d;var pattern = /progress/gi;var ans = messageContainer.innerHTML.match(/\w+.\w+,\sdeploy\sprogress\s\d+/g);var dic = new Array();for (item in ans){dic_key = ans[item].split(',')[0];dic_value = ans[item].split(',')[1].split(" ")[3];dic[dic_key] = dic_value;}for (key in dic) {if(document.getElementById(key + "label") == undefined){var span=document.createElement('span');span.setAttribute("id", key + "label");percentContainer.appendChild(span);document.getElementById(key + "label").innerHTML = key}if(document.getElementById(key) == undefined){var span=document.createElement('span');span.setAttribute("id", key);percentContainer.appendChild(span);//document.getElementById(key).innerHTML =dic[key]; $(span).radialIndicator({barColor: {10: '#0000FF',70: '#0000FF',90: '#0000FF',100: '#33CC33'},radius: 25,barWidth: 3,initValue: dic[key],roundCorner : true,percentage: true});radialObj =$(span).data('radialIndicator');}radialObj.animate(dic[key]);console.log(key, dic[key]);}};ws.onclose = function() {};console.log(msg);if (msg == "refresh") {sh=setInterval(function(){ws.send(msg+"-"+dev_version, function(){})},2000);} else {clearInterval(sh);document.getElementById("actionSpn").innerText = 'OutPut';}} else {messageContainer.innerHTML += "此瀏覽器不支持websocket！";}}</script>

樣子：

總結(jié)

以上是生活随笔為你收集整理的稍微成型点的用WEBSOCKET实现的实时日志LOG输出的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。