implementing real time web applications with django

Implementing real time web applications with Django

Kristian Øllegaard

1

onsdag den 6. juni 12

@oellegaardgithub.com/KristianOellegaard

About me

• Software Developer/System Administrator at Divio

• Django since 0.96

• Danish, lived in Zurich 1,5 year

2



Why real time?

• Better user experience

• More options in front end

• Make the web feel like native apps

• Showing live data.

• Collaboration is much easier.

3



Finding the right tool

• Criteria's

• Use websockets, but have fallbacks

• Good browser support (incl. old IE)

• Should be usable from python

• Does not require extensive changes in frontend

• “As fast as it can be”

4



The tools you want

Node.js + Socket.io

5



The tools you want

Node.js + Socket.io(well, we don’t want this, but socket.io needs it)

5



The tools you want

• Node.js

• Built on Chrome's JavaScript runtime

• Uses an event-driven, non-blocking I/O model

• Socket.io

• One interface for all transport methods (sockets, polling, etc.)

• Compatible with almost everything

6



Why not implement it in Python?

• Already active community

• Can be used from python without too much trouble

• Most people know very basic javascript

• More importantly, frontend engineers, knows javascript and can therefore contribute to the different browser-specific implementations.

7



Using redis for cross-language communication

• Support for many datatypes

• Can be used both as storage and as a queue

• Implemented in many different languages

• For the usage in this talk, any other queue could have been used as well.

8



Basic concept

• Something happens, the user must be notified in real time

• From e.g. django we insert the new value into the queue

• Node.js listens on the queue and emits any content directly to the browser via socket.io

• This is btw. very fast!

Redis

Django Node.js E.g. Celery

Browser

publish

subscribe

publish

subscribe

9



Sample node.js app

var io = require('socket.io').listen(8001);var redis = require('redis').createClient();

redis.psubscribe("socketio_*"); // Could be any pattern

io.sockets.on('connection', function (socket) { redis.on('pmessage', function(pattern, channel, key){ socket.emit(channel, key); });});

10



Sample HTML/JS

<script src="http://localhost:8001/socket.io/socket.io.js"></script><script> var socket = io.connect('http://localhost:8001/'); socket.on('socketio_news', function (data) { console.log(data); });</script>

11


http://localhost:8001/socket.io/socket.io.js

http://localhost:8001/socket.io/socket.io.js

http://localhost:8001/'

http://localhost:8001/'


Sample usage from Python

import redisimport jsonredis_subscribe = redis.StrictRedis()redis_subscribe.publish("socketio_news", json.dumps({ 'title': 'Djangocon 2012',}))

12



Short demo

13



Hosting socket.io

• Nginx does not support websockets!

• Needs its own app, if hosted on an application cloud (e.g. heroku)

• Recommended to expose the node server directly

• But hey, it’s node.js, it scales!

14



Can I use this today?

• Yes

• But, please don’t

15



Client Authentication

• Socket.io handles authentication from node -> client

• Currently no authentication between django and node.

• Could possibly be solved by storing your sessions in redis and checking them on connection.

16



Notes

• Concept should work with any language/framework

• E.g. communicating between ruby and python

17



Questions?

http://kristian.io@oellegaard

18


http://kristian.io

http://kristian.io

implementing real time web applications with django

Technology