The document discusses using Gevent and Socket.io for building real-time web applications, providing code examples for building a chat application that uses Gevent for asynchronous programming, Socket.io for client-server communication, and ZeroMQ for inter-process communication between greenlets. It describes the design and implementation of a web-based chat application that allows clients to send and receive messages in real-time using these technologies.

1. Real-Time Web: Gevent and Socket.io Rick Copeland @rick446 [email_address]

12. SocketIO to the Rescue “ Socket.IO aims to make realtime apps possible in every browser and mobile device, blurring the differences between the different transport mechanisms.”

13. Socket.io Example <script src=&quot;/socket.io/socket.io.js&quot; ></script> <script> var socket = io.connect( 'http://localhost'); socket.on('news', function (data) { console.log(data); socket.emit( 'my other event’, { my : 'data' }); }); </script>

14. gevent_socketio def hello_world(environ, start_response): if not environ[ 'PATH_INFO'] .startswith( '/socket.io'): return serve_file(environ, start_response) socketio = environ[ 'socketio'] while True: socketio .send( 'Hello, world') gevent .sleep( 2)

20. WebChat: Design Incoming Greenlet ZMQ send Outgoing Greenlet Socket.io ZMQ recv JSON Messages JSON Messages Socket.io

21. WebChat: HTML <h1> Socket.io Chatterbox </h1> <div id=&quot;status&quot; style=&quot;border:1px solid black;&quot; > Disconnected </div> <form> <input id=&quot;input&quot; style=&quot;width: 35em;&quot; > </form> <div id=&quot;data&quot; style=&quot;border:1px solid black;&quot; > </div> <script src=&quot;/js/jquery.min.js&quot; ></script> <script src=&quot;/js/socket.io.js&quot; ></script> <script src=&quot;/js/test.js&quot; ></script>

22. WebChat: Javascript Setup ( function () { // Create and connect socket var socket = new io.Socket( 'localhost'); socket.connect(); // Socket status var $status = $( '#status'); socket.on('connect', function () { $status.html( '<b>Connected: ' + socket.transport.type + '</b>'); }); socket.on('error', function () { $status.html( '<b>Error</b>'); }); socket.on('disconnect', function () { $status.html( '<b>Closed</b>'); });

23. WebChat: Javascript Communication // Send data to the server var $form = $( 'form'); var $input = $( '#input'); $form.bind('submit', function () { socket.send($input.val()); $input.val( ''); return false ; }); // Get data back from the server var $data = $( '#data'); socket.on('message', function (msg) { msg = $.parseJSON(msg) ; var u = msg.u || 'SYSTEM’; $data.prepend($( '<em>' + u + '</em>: ' + msg.m + '<br/>')); }); })();

24. WebChat: Server def chat(environ, start_response): if not environ[ 'PATH_INFO'] .startswith( '/socket.io): return serve_file(environ, start_response) socketio = environ[ 'socketio'] #... handle auth ... zmq_sock = context.socket(zmq.SUB) zmq_sock.setsockopt(zmq.SUBSCRIBE, &quot;&quot;) zmq_sock .connect( 'inproc://chat') greenlets = [ gevent.spawn(incoming, uname, socketio), gevent.spawn(outgoing, zmq_sock, socketio) ] gevent .joinall(greenlets)

25. WebChat: Greenlets def incoming(uname, socketio): while True: for part in socketio .recv(): sock_queue.send(json.dumps( dict( u =uname, m=part))) def outgoing(zmq_sock, socketio): while True: socketio.send(zmq_sock.recv())

26. Get the Code! Socket.io http://socket.io MIT License Chatterbox http://sf.net/u/rick446/pygotham Apache License ZeroMQ http://www.zeromq.org LGPL License Gevent http://gevent.org MIT License

27. Rick Copeland @rick446 [email_address]