Powering your website with realtime data
-
Upload
becoded -
Category
Technology
-
view
2.174 -
download
3
description
Transcript of Powering your website with realtime data
![Page 1: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/1.jpg)
Powering your website with realtime data
Bert Van [email protected] - @tbotwit
Sunday 26 February 2012
![Page 2: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/2.jpg)
Bert Van Hauwaert
• Live in Belgium
• Founder of be.coded
• Freelance web application developer & consultant
• ZCE 5.0
• Working on portal sites and realtime auction sites
Sunday 26 February 2012
![Page 3: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/3.jpg)
Overview
• The old days
• XMPP
• Install server
• Configure apache
• Libraries
• Examples
Sunday 26 February 2012
![Page 4: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/4.jpg)
Overview
• The old days
• XMPP
• Install server
• Configure apache
• Libraries
• Examples
Sunday 26 February 2012
![Page 5: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/5.jpg)
The old days
• <meta http-equiv=”refresh” content=”5” />
• <script >
• AJAX
Sunday 26 February 2012
![Page 6: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/6.jpg)
Overview
• The old days
• XMPP
• Install server
• Configure apache
• Libraries
• Examples
Sunday 26 February 2012
![Page 7: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/7.jpg)
Websockets
Source: http://caniuse.com/#feat=websockets
Sunday 26 February 2012
![Page 8: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/8.jpg)
XMPP: what
• Extensible Messaging and Presence Protocol
• Jabber
• XML
• Client - Server - Component
Sunday 26 February 2012
![Page 9: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/9.jpg)
XMPP: stanzas
• <presence>
• <message>
• <iq>
Sunday 26 February 2012
![Page 10: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/10.jpg)
XMPP: stanzas
• <presence>
• <message>
• <iq>
Sunday 26 February 2012
![Page 11: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/11.jpg)
XMPP: stanzas
• <presence>
• <message>
• <iq>
Sunday 26 February 2012
![Page 12: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/12.jpg)
XMPP: stanzas
• <presence>
• <message>
• <iq>
Sunday 26 February 2012
![Page 13: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/13.jpg)
XMPP: addressing
• JID (Jabber Identifier)
• Three main parts
• [ node "@" ] domain [ "/" resource ]
Sunday 26 February 2012
![Page 14: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/14.jpg)
XMPP: extensions
• XMPP Extension Protocol - XEP
• http://xmpp.org/xmpp-protocols/xmpp-extensions/
Sunday 26 February 2012
![Page 15: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/15.jpg)
XMPP: advantages
• Open
• Decentralized
• Secure
• Extensible
Sunday 26 February 2012
![Page 16: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/16.jpg)
XMPP: disadvantages
• Statefulness
• Overhead
Sunday 26 February 2012
![Page 17: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/17.jpg)
XMPP: example<stream:stream> <iq type="get" id="roster1"> <query xmlns:"jabber:iq:roster" /> </iq> <presence /> <message to="[email protected]" from="[email protected]/speakerroom" type="chat"> <body> I hope you will enjoy this talk </body> </message> <presence> <show>dnd</show> <status>Giving a talk @ PHP UK conference</status> </presence></stream:stream>
Sunday 26 February 2012
![Page 18: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/18.jpg)
XMPP: example
<stream:stream> <iq type="get" id="roster1"> <query xmlns:"jabber:iq:roster" /> </iq> <presence /> <message to="[email protected]" from="[email protected]/speakerroom" type="chat"> <body> I hope you will enjoy this talk </body> </message> <presence> <show>dnd</show> <status>Giving a talk @ PHP UK conference</status> </presence></stream:stream>
Sunday 26 February 2012
![Page 19: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/19.jpg)
XMPP: example<stream:stream>
<iq type="get" id="roster1"> <query xmlns:"jabber:iq:roster" /> </iq> <presence /> <message to="[email protected]" from="[email protected]/speakerroom" type="chat"> <body> I hope you will enjoy this talk </body> </message> <presence> <show>dnd</show> <status>Giving a talk @ PHP UK conference</status> </presence></stream:stream>
Sunday 26 February 2012
![Page 20: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/20.jpg)
XMPP: example
<stream:stream> <iq type="get" id="roster1"> <query xmlns:"jabber:iq:roster" /> </iq>
<presence /> <message to="[email protected]" from="[email protected]/speakerroom" type="chat"> <body> I hope you will enjoy this talk </body> </message> <presence> <show>dnd</show> <status>Giving a talk @ PHP UK conference</status> </presence></stream:stream>
Sunday 26 February 2012
![Page 21: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/21.jpg)
XMPP: example<stream:stream> <iq type="get" id="roster1"> <query xmlns:"jabber:iq:roster" /> </iq> <presence />
<message to="[email protected]" from="[email protected]/speakerroom" type="chat"> <body> I hope you will enjoy this talk </body> </message> <presence> <show>dnd</show> <status>Giving a talk @ PHP UK conference</status> </presence></stream:stream>
Sunday 26 February 2012
![Page 22: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/22.jpg)
XMPP: example<stream:stream> <iq type="get" id="roster1"> <query xmlns:"jabber:iq:roster" /> </iq> <presence /> <message to="[email protected]" from="[email protected]/speakerroom" type="chat"> <body> I hope you will enjoy this talk </body> </message>
<presence> <show>dnd</show> <status> Giving a talk @ PHP UK conference </status> </presence></stream:stream>
Sunday 26 February 2012
![Page 23: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/23.jpg)
XMPP: example<stream:stream> <iq type="get" id="roster1"> <query xmlns:"jabber:iq:roster" /> </iq> <presence /> <message to="[email protected]" from="[email protected]/speakerroom" type="chat"> <body> I hope you will enjoy this talk </body> </message> <presence> <show>dnd</show> <status> Giving a talk @ PHP UK conference </status> </presence>
</stream:stream>
Sunday 26 February 2012
![Page 24: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/24.jpg)
XMPP: XEP-0060 (1)
• PubSub (Publish / Subscribe)
• Bandwidth / resources
Sunday 26 February 2012
![Page 25: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/25.jpg)
XMPP: XEP-0060 (2)
<iqfrom="[email protected]/car" id="ams9nz78"to="pubsub.holiday.com"type="set"><pubsub xmlns="http://jabber.org/protocol/pubsub"><subscribe node="are-we-there-yet" jid="[email protected]"/>
</pubsub></iq>
Sunday 26 February 2012
![Page 26: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/26.jpg)
XMPP: XEP-0060 (3)
<iqfrom="[email protected]/car" id="wmn78e45a" to="pubsub.holiday.com"type="set"><pubsub xmlns="http://jabber.org/protocol/pubsub"><publish node="are-we-there-yet"><item><there xmlns="http://holiday.com/there-yet" status="true"/>
</item></publish>
</pubsub></iq>
Sunday 26 February 2012
![Page 27: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/27.jpg)
XMPP: XEP-0060 (4)
<message from="pubsub.holiday.com" to="[email protected]"><event xmlns="http://jabber.org/protocol/pubsub#event"><items node="are-we-there-yet"><item id="ax78ui789q"><there xmlns="http://holiday.com/there-yet" status="true"/>
</item></items>
</event></message>
Sunday 26 February 2012
![Page 28: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/28.jpg)
XMPP: XEP-0045 (1)
• MUC / Multi-User Chat
• “Multiplier”
Sunday 26 February 2012
![Page 29: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/29.jpg)
XMPP: XEP-0045 (2)
<presencefrom="[email protected]/resource" to="[email protected]/nickname"><x xmlns="http://jabber.org/protocol/muc"/>
</presence>
Sunday 26 February 2012
![Page 30: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/30.jpg)
XMPP: XEP-0045 (3)
<message to="[email protected]"from="[email protected]/resource" type="groupchat "><body>Lorem Ipsum</body>
</message>
<message to="[email protected]/resource"from="[email protected]/nickname" type="groupchat "><body>Lorem Ipsum</body></message>
Sunday 26 February 2012
![Page 31: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/31.jpg)
Overview
• The old days
• XMPP
• Install server
• Configure apache
• Libraries
• Examples
Sunday 26 February 2012
![Page 32: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/32.jpg)
Install server: starting point
• Debian
• web server
• SQL database
• SSH server
Sunday 26 February 2012
![Page 33: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/33.jpg)
Install server: apt sources
• apt-get install vim
• vim /etc/apt/sources.list
• deb http://ftp.belnet.be/debian/ squeeze main non-freedeb-src http://ftp.belnet.be/debian/ squeeze maindeb http://security.debian.org/ squeeze/updates main non-freedeb-src http://security.debian.org/ squeeze/updates maindeb http://packages.dotdeb.org stable alldeb-src http://packages.dotdeb.org stable all
Sunday 26 February 2012
![Page 34: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/34.jpg)
Install server: prerequisites (1)
• wget http://www.dotdeb.org/dotdeb.gpg
• cat dotdeb.gpg | apt-key add -
• apt-get update
• apt-get install sun-java6-jre sun-java6-fonts ident2
Sunday 26 February 2012
![Page 35: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/35.jpg)
Install server: prerequisites (2)
• apt-get install mysql-server mysql-client
• apt-get install php5 php5-cli php5-common php5-dev php5-mysql php5-curl php-pear
• Database & user
Sunday 26 February 2012
![Page 36: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/36.jpg)
Install server: Openfire (1)
• Openfire 3.7.1
• http://www.igniterealtime.org/projects/openfire/
• wget -O openfire_3.7.1_all.deb http://www.igniterealtime.org/downloadServlet?filename=openfire/openfire_3.7.1_all.deb
• dpkg -i openfire_3.7.1_all.deb
Sunday 26 February 2012
![Page 37: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/37.jpg)
Install server: Openfire (2)
• http://[server-ip]:9090/
Sunday 26 February 2012
![Page 38: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/38.jpg)
Sunday 26 February 2012
![Page 39: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/39.jpg)
Sunday 26 February 2012
![Page 40: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/40.jpg)
Sunday 26 February 2012
![Page 41: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/41.jpg)
Sunday 26 February 2012
![Page 42: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/42.jpg)
Sunday 26 February 2012
![Page 43: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/43.jpg)
Sunday 26 February 2012
![Page 44: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/44.jpg)
Sunday 26 February 2012
![Page 45: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/45.jpg)
Install server: Openfire (3)
• Plugins
• User Service
• Monitoring Service
Sunday 26 February 2012
![Page 46: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/46.jpg)
Overview
• The old days
• XMPP
• Install server
• Configure apache
• Libraries
• Examples
Sunday 26 February 2012
![Page 47: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/47.jpg)
Configure apache: why(1)
Client - polling
Server
Client - long polling
new data
no d
ata
no d
ata
no d
ata
data
data
Sunday 26 February 2012
![Page 48: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/48.jpg)
Configure apache: why(2)
• BOSH (Bidirectional streams Over Synchronous HTTP)
Sunday 26 February 2012
![Page 49: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/49.jpg)
Configure apache: proxy (1)
• cd /etc/apache2/mods-enabled/
• ln -s ../mods-available/proxy.load
• ln -s ../mods-available/proxy_http.load
• ln -s ../mods-available/rewrite.load
Sunday 26 February 2012
![Page 50: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/50.jpg)
Configure apache: proxy (2)
<VirtualHost *:80> Options FollowSymLinks ServerAdmin [email protected] ServerName xmpp.dev.becoded.be ServerAlias static.xmpp.dev.becoded.be # Indexes + Directory Root. DirectoryIndex index.php DocumentRoot /var/www/vhost/xmpp.dev.becoded.be/htdocs/public/ php_admin_value open_basedir ".:/var/www/vhost/xmpp.dev.becoded.be/htdocs:/var/www/library/Zend-latest/library:../:/usr/share/php:/tmp" php_value include_path ".:/var/www/vhost/xmpp.dev.becoded.be/htdocs:/var/www/library/Zend-latest/library:/usr/share/php" php_admin_value upload_tmp_dir "/tmp" SetEnv APPLICATION_ENV development
# Logfiles ErrorLog /var/www/vhost/xmpp.dev.becoded.be/logs/error.log CustomLog /var/www/vhost/xmpp.dev.becoded.be/logs/access.log combined
# XMPP proxy ruleProxyRequests OffProxyPass /bind http://127.0.0.1:7070/http-bind/ProxyPassReverse /bind http://127.0.0.1:7070/http-bind/</VirtualHost>
Sunday 26 February 2012
![Page 51: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/51.jpg)
Overview
• The old days
• XMPP
• Install server
• Configure apache
• Libraries
• Examples
Sunday 26 February 2012
![Page 52: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/52.jpg)
Libraries
• ZF - http://framework.zend.com
• jQuery - http://jquery.com/
• jQuery UI - http://jqueryui.com/
• XMPPHP - http://code.google.com/p/xmpphp
• Jaxl - http://jaxl.net
• Strophe.js - http://strophe.im
Sunday 26 February 2012
![Page 53: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/53.jpg)
Libraries: XMPPHP
$connection = new XMPPHP_XMPP( $host, $port, $identifier->node, $identifier->password, $identifier->resource, $domain, $printlog, $loglevel);$connection->connect();$connection->processUntil('session_start');$connection->message('support@demo', 'Hello world');$connection->disconnect();
Sunday 26 February 2012
![Page 54: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/54.jpg)
Libraries: Jaxl$connection = new JAXL(array( 'user' => $identifier->node, 'pass' => $identifier->password,
'host' => $host,'domain' => $domain,
'port' => $port, 'authType' => 'PLAIN', 'logLevel' => $loglevel ));$connection->addPlugin('jaxl_post_auth', '_postAuthHook');$connection->startCore("stream");
public function _postAuthHook ($payload, $jaxl) {$jaxl->sendMessage('support@demo', 'Hello world');$jaxl->shutdown();
}
Sunday 26 February 2012
![Page 55: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/55.jpg)
Libraries: Strophe.jsvar connection = new Strophe.Connection('/bind');connection.connect( jid, password, function (status) { if (status == Strophe.Status.CONNECTED) { var msg = $msg({ to : 'support@demo', type : "chat" }).c('body').t('Hello world'); connection.send(msg); setTimeout(function () { connection.disconnect(); }, 500); } });
Sunday 26 February 2012
![Page 56: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/56.jpg)
Overview
• The old days
• XMPP
• Install server
• Configure apache
• Libraries
• Examples
Sunday 26 February 2012
![Page 57: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/57.jpg)
Examples: setup
Sunday 26 February 2012
![Page 58: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/58.jpg)
Sunday 26 February 2012
![Page 59: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/59.jpg)
Examples: messages
• Browser
• Log
• Adium
Sunday 26 February 2012
![Page 60: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/60.jpg)
Sunday 26 February 2012
![Page 61: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/61.jpg)
Sunday 26 February 2012
![Page 62: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/62.jpg)
Sunday 26 February 2012
![Page 63: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/63.jpg)
Sunday 26 February 2012
![Page 64: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/64.jpg)
Example: IQ ping pong (1)
this.statusHandler = function (status) { var me = this; if (status == Strophe.Status.CONNECTED) { me.connection.addHandler( function(msg) { //(Function) handler return me.handlePong(msg); },
null, //(String) ns 'iq', //(String) name null, //(String) type 'pingPong'); //(String) id me.sendPing(Strophe.getDomainFromJid(me.connection.jid)); } };
Sunday 26 February 2012
![Page 65: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/65.jpg)
Example: IQ ping pong (2)
this.sendPing = function (to){ var me = this; var iq = $iq({ to: to, type : 'get', id : 'pingPong' }).c('ping',
{xmlns: 'urn:xmpp:ping'}); me.connection.send(iq);};
<iq to='demo' type='get' id='pingPong' xmlns='jabber:client'> <ping
xmlns='urn:xmpp:ping'/></iq>
Sunday 26 February 2012
![Page 66: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/66.jpg)
Example: IQ ping pong (3)
this.handlePong = function (msg){ var me = this; var objMsg = $(msg); var from = objMsg.attr('from'); me.log('Receiving ' + objMsg.attr('type') + ' from "' + objMsg.attr('from') + '" with id "' + objMsg.attr('id') + '"'); me.connection.disconnect();};
<iq xmlns="jabber:client" type="result" id="pingPong" from="demo" to="demo1@demo/eeffca60"/>
Sunday 26 February 2012
![Page 67: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/67.jpg)
Sunday 26 February 2012
![Page 68: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/68.jpg)
Sunday 26 February 2012
![Page 69: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/69.jpg)
Sunday 26 February 2012
![Page 70: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/70.jpg)
Example: support chat (1)
this.bindSendMessage = function (){ var me = this; var chatMsg = $('#message'); $('#sendMessage').bind('click', function() { me.sendChatMessage(chatMsg.val()); me.resetTextarea(chatMsg); }); chatMsg.keyup(function(event) { if (event.keyCode == 13 && event.shiftKey) { me.sendChatMessage(chatMsg.val()); me.resetTextarea(chatMsg); } });};
Sunday 26 February 2012
![Page 71: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/71.jpg)
Example: support chat (2)
this.statusHandler = function (status){ var me = this; me.logStatus(status); if (status == Strophe.Status.CONNECTED) { me.connection.addHandler( function(msg) { //(Function) handler. return me.handleChatMessage(msg); }, null, //(String) ns 'message', //(String) name 'chat'); //(String) type }};
Sunday 26 February 2012
![Page 72: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/72.jpg)
Example: support chat (3)
this.handleChatMessage = function (msg){ var me = this; var objMsg = $(msg); var from = objMsg.attr('from'); var nick = Strophe.getNodeFromJid(from); var body = objMsg.children('body').text(); me.addMessageToChat(nick, body); return true;};
Sunday 26 February 2012
![Page 73: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/73.jpg)
Example: support chat (4)
this.addMessageToChat = function (nick, body){ var me = this; var container = $('#chat'); var atBottom =
container.scrollTop() >= container[0].scrollHeight - container.height();
container.append('<dt>'+ nick +'</dt><dd>'+
me.nl2br(body, true) +'</dd>'); if (atBottom) { container.scrollTop(container[0].scrollHeight); }};
Sunday 26 February 2012
![Page 74: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/74.jpg)
Sunday 26 February 2012
![Page 75: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/75.jpg)
Sunday 26 February 2012
![Page 76: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/76.jpg)
Example: statistics
this.handleHighChartData = function (msg){ var me = this; var objMsg = $(msg);
var body = objMsg.children('body').text(); me.chart.series[0].setData(jQuery.parseJSON(body)); return true;};
Sunday 26 February 2012
![Page 77: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/77.jpg)
Sunday 26 February 2012
![Page 78: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/78.jpg)
Sunday 26 February 2012
![Page 79: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/79.jpg)
Sunday 26 February 2012
![Page 80: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/80.jpg)
Sunday 26 February 2012
![Page 81: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/81.jpg)
Example: prebind BOSH (1)
• SID - RID
• Security
• User friendly
• Performance
• Persisting
Sunday 26 February 2012
![Page 82: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/82.jpg)
Example: prebind BOSH(2)
this.initConnection = function (){ var me = this;
me.connection = new Strophe.Connection(me.httpBindUrl); me.connection.attach( me.options.service.jid, me.options.service.sid, me.options.service.rid, function (status) { me.statusHandler(status); });};
Sunday 26 February 2012
![Page 83: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/83.jpg)
Sunday 26 February 2012
![Page 84: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/84.jpg)
Sunday 26 February 2012
![Page 85: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/85.jpg)
Sunday 26 February 2012
![Page 86: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/86.jpg)
Sunday 26 February 2012
![Page 87: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/87.jpg)
Books
Sunday 26 February 2012
![Page 88: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/88.jpg)
Thank you
• Code: https://github.com/becoded/talk-xmpp-demo
• Slides: Slideshare
• Rate / comments: http://joind.in
Sunday 26 February 2012
![Page 91: Powering your website with realtime data](https://reader034.fdocuments.in/reader034/viewer/2022051514/54b7b1454a7959c9688b45b3/html5/thumbnails/91.jpg)
Questions
? ? ? ?
Sunday 26 February 2012