Socket.IO in Chess Realtime Multiplayer Web Application

Transcript

1. Socket.IO in Chess Realtime Multiplayer Web Application @OmarQunsul
7. Websockets
9. Mozilla Firefox 4 in 2010 dropped the support for Websockets, due to security issues.
10. What ?
12. http://www.socket.io
13. WebSocket Adobe® Flash® Socket AJAX long polling AJAX multipart streaming Forever Iframe JSONP Polling
14. Server ( node.js ) Socket.IO Client Browser JS
15. NODE.JS ( Server ) var io = require('socket.io').listen(80); io.sockets.on('connection', function (socket) { socket.emit('news', { hello: 'world' }); socket.on('my other event', function (data) { console.log(data); }); });
16. NODE.JS ( Server ) var io = require('socket.io').listen(80); io.sockets.on('connection', function (socket) { socket.emit('news', { hello: 'world' }); socket.on('my other event', function (data) { console.log(data); }); });
17. NODE.JS ( Server ) var io = require('socket.io').listen(80); io.sockets.on('connection', function (socket) { socket.emit('news', { hello: 'world' }); socket.on('my other event', function (data) { console.log(data); }); });
18. Browser ( Javascript ) <script src="/socket.io/socket.io.js"></script> <script> var socket = io.connect('http://localhost'); socket.on('news', function (data) { console.log(data); socket.emit('my other event', { my: 'data' }); }); </script>
19. Browser ( Javascript ) <script src="/socket.io/socket.io.js"></script> <script> var socket = io.connect('http://localhost'); socket.on('news', function (data) { console.log(data); socket.emit('my other event', { my: 'data' }); }); </script>
20. Browser ( Javascript ) <script src="/socket.io/socket.io.js"></script> <script> var socket = io.connect('http://localhost'); socket.on('news', function (data) { console.log(data); socket.emit('my other event', { my: 'data' }); }); </script>
21. Socket.IO + Express var app = require('express')() , server = require('http').createServer(app) , io = require('socket.io').listen(server); server.listen(80); app.get('/', function (req, res) { res.sendfile(__dirname + '/index.html'); }); io.sockets.on('connection', function (socket) { socket.emit('news', { hello: 'world' }); socket.on('my other event', function (data) { console.log(data); }); });
22. C++, Objective C, Ruby, Python, Erlang, Lua, Perl, Go, PHP ... and many more. Unofficial server side implementations
23. Desktop Internet Explorer 5.5+ ! Safari 3+ Google Chrome 4+ Firefox 3+ Opera 10.61+ Mobile iPhone Safari iPad Safari Android WebKit WebOs WebKit Browser Support
24. For more information, demos http://socket.io
25. chessduo.com and oh, my chess website is
26. Thanks !