Created
November 23, 2019 14:00
-
-
Save pedrominicz/48c63447e1d4b30ff217ba533d3fc35d to your computer and use it in GitHub Desktop.
Simple WebSockets chat in Python.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| #!/usr/bin/env python3 | |
| import tornado.web | |
| import tornado.websocket | |
| import tornado.ioloop | |
| connections = set() | |
| class IndexHandler(tornado.web.RequestHandler): | |
| def get(self): | |
| self.render('index.html') | |
| class WebSocketHandler(tornado.websocket.WebSocketHandler): | |
| def open(self): | |
| global connections | |
| connections.add(self) | |
| def on_message(self, message): | |
| global connections | |
| for connection in connections: | |
| connection.write_message(message) | |
| app = tornado.web.Application([ | |
| (r'/', IndexHandler), | |
| (r'/websocket', WebSocketHandler), | |
| ]) | |
| if __name__ == '__main__': | |
| app.listen(8000) | |
| tornado.ioloop.IOLoop.instance().start() |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html lang="en-US"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <title>Simple WebSockets chat</title> | |
| </head> | |
| <body> | |
| <div id="chat"></div> | |
| <form onsubmit="send();" action="javascript:void(0);"> | |
| <input type="text" id="message" required> | |
| <input type="submit"> | |
| </form> | |
| <script> | |
| 'use strict'; | |
| var chat = document.getElementById('chat'); | |
| var name = 'unknown'; | |
| var socket = new WebSocket('ws://localhost:8000/websocket') | |
| function show_message(message) { | |
| var new_message = document.createElement('div'); | |
| new_message.innerHTML = message; | |
| chat.appendChild(new_message); | |
| } | |
| function escape_html(text) { | |
| return text | |
| .replace(/&/g, '&') | |
| .replace(/</g, '<') | |
| .replace(/>/g, '>') | |
| .replace(/'/g, '"') | |
| .replace(/'/g, '''); | |
| } | |
| socket.onmessage = function(message) { | |
| show_message(message.data); | |
| } | |
| function send() { | |
| var message_box = document.getElementById('message'); | |
| var message = message_box.value; | |
| var command = message.trim().split(' '); | |
| if(command[0] === '/name' && | |
| command.length === 2 && | |
| command[1].match('^[A-Za-z0-9]+$')) { | |
| name = command[1]; | |
| show_message(`<b>name set to: ${name}</b>`); | |
| message_box.value = ''; | |
| return; | |
| } else if(command[0][0] === '/') { | |
| show_message(`<b>invalid command: ${escape_html(message.trim())}</b>`); | |
| message_box.value = ''; | |
| return; | |
| } | |
| socket.send(`<b>${name}:</b> ${escape_html(message)}`); | |
| message_box.value = ''; | |
| } | |
| </script> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment