SlideShare a Scribd company logo
Powering your website with
                 realtime data


                                  Bert Van Hauwaert
                          bert@becoded.be - @tbotwit
Sunday 26 February 2012
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
Overview

    •   The old days

    •   XMPP

    •   Install server

    •   Configure apache

    •   Libraries

    •   Examples

Sunday 26 February 2012
Overview

    •   The old days

    •   XMPP

    •   Install server

    •   Configure apache

    •   Libraries

    •   Examples

Sunday 26 February 2012
The old days


    •   <meta http-equiv=”refresh” content=”5” />

    •   <script >

    •   AJAX




Sunday 26 February 2012
Overview

    •   The old days

    •   XMPP

    •   Install server

    •   Configure apache

    •   Libraries

    •   Examples

Sunday 26 February 2012
Websockets




                          Source: http://caniuse.com/#feat=websockets
Sunday 26 February 2012
XMPP: what


    •   Extensible Messaging and Presence Protocol

    •   Jabber

    •   XML

    •   Client - Server - Component



Sunday 26 February 2012
XMPP: stanzas


    •   <presence>

    •   <message>

    •   <iq>




Sunday 26 February 2012
XMPP: stanzas


    •   <presence>

    •   <message>

    •   <iq>




Sunday 26 February 2012
XMPP: stanzas


    •   <presence>

    •   <message>

    •   <iq>




Sunday 26 February 2012
XMPP: stanzas


    •   <presence>

    •   <message>

    •   <iq>




Sunday 26 February 2012
XMPP: addressing


    •   JID (Jabber Identifier)

    •   Three main parts

        •   [ node "@" ] domain [ "/" resource ]




Sunday 26 February 2012
XMPP: extensions



    •   XMPP Extension Protocol - XEP

    •   http://xmpp.org/xmpp-protocols/xmpp-extensions/




Sunday 26 February 2012
XMPP: advantages


    •   Open

    •   Decentralized

    •   Secure

    •   Extensible



Sunday 26 February 2012
XMPP: disadvantages



    •   Statefulness

    •   Overhead




Sunday 26 February 2012
XMPP: example
         <stream:stream>
            <iq type="get" id="roster1">
               <query xmlns:"jabber:iq:roster" />
            </iq>

            <presence />
            <message to="attendees@phpukconference.com"
               from="bert@becoded.be/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
XMPP: example
         <stream:stream>
                <iq type="get" id="roster1">
                    <query xmlns:"jabber:iq:roster" />
                </iq>

             <presence />
             <message to="attendees@phpukconference.com"
                  from="bert@becoded.be/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
XMPP: example
         <stream:stream>
                <iq type="get" id="roster1">
                  <query xmlns:"jabber:iq:roster" />
                </iq>
             <presence />
             <message to="attendees@phpukconference.com"
                  from="bert@becoded.be/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
XMPP: example
         <stream:stream>
             <iq type="get" id="roster1">
                  <query xmlns:"jabber:iq:roster" />
             </iq>


                <presence />
             <message to="attendees@phpukconference.com"
                  from="bert@becoded.be/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
XMPP: example
         <stream:stream>
             <iq type="get" id="roster1">
                  <query xmlns:"jabber:iq:roster" />
             </iq>

                <presence />
                <message
                  to="attendees@phpukconference.com"
                  from="bert@becoded.be/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
XMPP: example
         <stream:stream>
             <iq type="get" id="roster1">
                  <query xmlns:"jabber:iq:roster" />
             </iq>

                <presence />
                <message to="attendees@phpukconference.com"
                    from="bert@becoded.be/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
XMPP: example
         <stream:stream>
             <iq type="get" id="roster1">
                  <query xmlns:"jabber:iq:roster" />
             </iq>

                <presence />
                <message to="attendees@phpukconference.com"
                    from="bert@becoded.be/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
XMPP: XEP-0060   (1)




    •   PubSub (Publish / Subscribe)

    •   Bandwidth / resources




Sunday 26 February 2012
XMPP: XEP-0060   (2)



         <iq
           from="child@holiday.com/car"
           id="ams9nz78"
           to="pubsub.holiday.com"
           type="set">
             <pubsub xmlns="http://jabber.org/
             protocol/pubsub">
               <subscribe node="are-we-there-yet"
               jid="child@holiday.com"/>
             </pubsub>
         </iq>


Sunday 26 February 2012
XMPP: XEP-0060           (3)

         <iq
           from="adult@holiday.com/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
XMPP: XEP-0060            (4)



         <message from="pubsub.holiday.com"
         to="child@holiday.com">
           <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
XMPP: XEP-0045   (1)




    •   MUC / Multi-User Chat

    •   “Multiplier”




Sunday 26 February 2012
XMPP: XEP-0045   (2)




         <presence
           from="user@domain.com/resource"
           to="room@conference.muc.com/nickname">
             <x xmlns=
               "http://jabber.org/protocol/muc"/>
         </presence>




Sunday 26 February 2012
XMPP: XEP-0045   (3)



         <message to="room@conference.muc.com"
           from="user@domain.com/resource"
           type="groupchat ">
           <body>Lorem Ipsum</body>
         </message>

         <message to="otherUser@domain.com/resource"
         from="room@conference.muc.com/nickname"
         type="groupchat ">
         <body>Lorem Ipsum</body>
         </message>

Sunday 26 February 2012
Overview

    •   The old days

    •   XMPP

    •   Install server

    •   Configure apache

    •   Libraries

    •   Examples

Sunday 26 February 2012
Install server: starting point


    •   Debian

        •   web server

        •   SQL database

        •   SSH server



Sunday 26 February 2012
Install server: apt sources

    •   apt-get install vim

    •   vim /etc/apt/sources.list
        •   deb http://ftp.belnet.be/debian/ squeeze main non-free
            deb-src http://ftp.belnet.be/debian/ squeeze main
            deb http://security.debian.org/ squeeze/updates main non-free
            deb-src http://security.debian.org/ squeeze/updates main
            deb http://packages.dotdeb.org stable all
            deb-src http://packages.dotdeb.org stable all




Sunday 26 February 2012
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
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
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
Install server: Openfire (2)



    •   http://[server-ip]:9090/




Sunday 26 February 2012
Sunday 26 February 2012
Sunday 26 February 2012
Sunday 26 February 2012
Sunday 26 February 2012
Sunday 26 February 2012
Sunday 26 February 2012
Sunday 26 February 2012
Install server: Openfire (3)


    •   Plugins

        •   User Service

        •   Monitoring Service




Sunday 26 February 2012
Overview

    •   The old days

    •   XMPP

    •   Install server

    •   Configure apache

    •   Libraries

    •   Examples

Sunday 26 February 2012
Configure apache: why                                      (1)



                   Client - polling




                                                ta




                                                                      ta
                                      ta




                                                                             data
                                           no da




                                                                 no da
                                 no da




                  Server

                                                              d ata
                                                          w
                                                     ne




                  Client - long polling                               data



Sunday 26 February 2012
Configure apache: why           (2)




    •   BOSH (Bidirectional streams Over Synchronous HTTP)




Sunday 26 February 2012
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
Configure apache: proxy (2)
        <VirtualHost *:80>
          Options FollowSymLinks
          ServerAdmin bert@becoded.be
          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 rule
        ProxyRequests Off
        ProxyPass /bind http://127.0.0.1:7070/http-bind/
        ProxyPassReverse /bind http://127.0.0.1:7070/http-bind/
        </VirtualHost>




Sunday 26 February 2012
Overview

    •   The old days

    •   XMPP

    •   Install server

    •   Configure apache

    •   Libraries

    •   Examples

Sunday 26 February 2012
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
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
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
Libraries: Strophe.js
     var 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
Overview

    •   The old days

    •   XMPP

    •   Install server

    •   Configure apache

    •   Libraries

    •   Examples

Sunday 26 February 2012
Examples: setup




Sunday 26 February 2012
Sunday 26 February 2012
Examples: messages


    •   Browser

        •   Log

    •   Adium




Sunday 26 February 2012
Sunday 26 February 2012
Sunday 26 February 2012
Sunday 26 February 2012
Sunday 26 February 2012
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
Example: IQ ping pong (2)

     this.sendPing = function (to)
     {
     	 var me = this;                    <iq
     	                                     to='demo'
                                           type='get'
     	 var iq = $iq({
                                           id='pingPong'
     	 	 to	 to,
            :
                                           xmlns='jabber:client'>
     	 	 type : 'get',                     	 <ping
     	 	 id : 'pingPong'                        xmlns='urn:xmpp:ping'/>
     	 	 }).c('ping',                    </iq>
            {xmlns: 'urn:xmpp:ping'});
     	
     	 me.connection.send(iq);
     };



Sunday 26 February 2012
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
Sunday 26 February 2012
Sunday 26 February 2012
Sunday 26 February 2012
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
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
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
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
Sunday 26 February 2012
Sunday 26 February 2012
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
Sunday 26 February 2012
Sunday 26 February 2012
Sunday 26 February 2012
Sunday 26 February 2012
Example: prebind BOSH (1)

    •   SID - RID

    •   Security

    •   User friendly

    •   Performance

    •   Persisting


Sunday 26 February 2012
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
Sunday 26 February 2012
Sunday 26 February 2012
Sunday 26 February 2012
Sunday 26 February 2012
Books




Sunday 26 February 2012
Thank you


    •   bert@becoded.be

    •   Code: https://github.com/becoded/talk-xmpp-demo

    •   Slides: Slideshare

    •   Rate / comments: http://joind.in



Sunday 26 February 2012
http://joind.in/4945
Sunday 26 February 2012
http://joind.in/4977
Sunday 26 February 2012
Questions



                          ?   ?   ?   ?




Sunday 26 February 2012

More Related Content

What's hot

Backbone JS - Journey to the Front End [Dev Nexus Conference]
Backbone JS - Journey to the Front End [Dev Nexus Conference]Backbone JS - Journey to the Front End [Dev Nexus Conference]
Backbone JS - Journey to the Front End [Dev Nexus Conference]
Brian Mann
 
Type URL, Enter, and Then …
Type URL, Enter, and Then …Type URL, Enter, and Then …
Type URL, Enter, and Then …
Jinglun Li
 
Week 1
Week 1Week 1
Week 1
Week 1Week 1
Week 1 (v3)
Week 1 (v3)Week 1 (v3)
Week 1 (v3)
Will Gaybrick
 
HPPG - high performance photo gallery
HPPG - high performance photo galleryHPPG - high performance photo gallery
HPPG - high performance photo gallery
Remigijus Kiminas
 
PHP and Web Services
PHP and Web ServicesPHP and Web Services
PHP and Web Services
Bruno Pedro
 
S314011 - Developing Composite Applications for the Cloud with Apache Tuscany
S314011 - Developing Composite Applications for the Cloud with Apache TuscanyS314011 - Developing Composite Applications for the Cloud with Apache Tuscany
S314011 - Developing Composite Applications for the Cloud with Apache Tuscany
Luciano Resende
 
Hppg
HppgHppg
Doctype netscape
Doctype netscapeDoctype netscape
Doctype netscape
claudia Moreno
 
Grok Drupal (7) Theming
Grok Drupal (7) ThemingGrok Drupal (7) Theming
Grok Drupal (7) Theming
PINGV
 
Please dont touch-3.5
Please dont touch-3.5Please dont touch-3.5
Please dont touch-3.5
Francesco Fullone
 
Realize mais com HTML 5 e CSS 3 - 16 EDTED - RJ
Realize mais com HTML 5 e CSS 3 - 16 EDTED - RJRealize mais com HTML 5 e CSS 3 - 16 EDTED - RJ
Realize mais com HTML 5 e CSS 3 - 16 EDTED - RJ
Leonardo Balter
 
Progressive Downloads and Rendering
Progressive Downloads and RenderingProgressive Downloads and Rendering
Progressive Downloads and Rendering
Stoyan Stefanov
 

What's hot (14)

Backbone JS - Journey to the Front End [Dev Nexus Conference]
Backbone JS - Journey to the Front End [Dev Nexus Conference]Backbone JS - Journey to the Front End [Dev Nexus Conference]
Backbone JS - Journey to the Front End [Dev Nexus Conference]
 
Type URL, Enter, and Then …
Type URL, Enter, and Then …Type URL, Enter, and Then …
Type URL, Enter, and Then …
 
Week 1
Week 1Week 1
Week 1
 
Week 1
Week 1Week 1
Week 1
 
Week 1 (v3)
Week 1 (v3)Week 1 (v3)
Week 1 (v3)
 
HPPG - high performance photo gallery
HPPG - high performance photo galleryHPPG - high performance photo gallery
HPPG - high performance photo gallery
 
PHP and Web Services
PHP and Web ServicesPHP and Web Services
PHP and Web Services
 
S314011 - Developing Composite Applications for the Cloud with Apache Tuscany
S314011 - Developing Composite Applications for the Cloud with Apache TuscanyS314011 - Developing Composite Applications for the Cloud with Apache Tuscany
S314011 - Developing Composite Applications for the Cloud with Apache Tuscany
 
Hppg
HppgHppg
Hppg
 
Doctype netscape
Doctype netscapeDoctype netscape
Doctype netscape
 
Grok Drupal (7) Theming
Grok Drupal (7) ThemingGrok Drupal (7) Theming
Grok Drupal (7) Theming
 
Please dont touch-3.5
Please dont touch-3.5Please dont touch-3.5
Please dont touch-3.5
 
Realize mais com HTML 5 e CSS 3 - 16 EDTED - RJ
Realize mais com HTML 5 e CSS 3 - 16 EDTED - RJRealize mais com HTML 5 e CSS 3 - 16 EDTED - RJ
Realize mais com HTML 5 e CSS 3 - 16 EDTED - RJ
 
Progressive Downloads and Rendering
Progressive Downloads and RenderingProgressive Downloads and Rendering
Progressive Downloads and Rendering
 

Viewers also liked

Project 10 B Pw
Project 10 B PwProject 10 B Pw
Project 10 B Pw
rix
 
Ws B 1 S.Bressaud
Ws B 1 S.BressaudWs B 1 S.Bressaud
Creative Commons
Creative CommonsCreative Commons
Creative CommonsAlbina
 
[2013 CodeEngn Conference 08] manGoo - Windows 8 Exploit
[2013 CodeEngn Conference 08] manGoo - Windows 8 Exploit[2013 CodeEngn Conference 08] manGoo - Windows 8 Exploit
[2013 CodeEngn Conference 08] manGoo - Windows 8 Exploit
GangSeok Lee
 
Networking на конференциях
Networking на конференцияхNetworking на конференциях
Networking на конференциях
Vitaliy Georgiev
 
Antisocial people
Antisocial peopleAntisocial people
Antisocial people
cheerxoxoforlife101
 
Поршневой жидкостный насос
Поршневой жидкостный насосПоршневой жидкостный насос
Поршневой жидкостный насосGreen_Day
 
Sp ws1 ulrich teichler
Sp ws1 ulrich teichlerSp ws1 ulrich teichler
Sp ws1 ulrich teichler
IAU_Past_Conferences
 
Anti social behaviour powerpoint (1)
Anti social behaviour powerpoint (1)Anti social behaviour powerpoint (1)
Anti social behaviour powerpoint (1)
Dani Cathro
 
IT Security and Wire Fraud Awareness Slide Deck
IT Security and Wire Fraud Awareness Slide DeckIT Security and Wire Fraud Awareness Slide Deck
IT Security and Wire Fraud Awareness Slide Deck
Don Gulling
 
Virus bulletin 2011 Conference Paper - Browser Exploit Packs - Exploitation T...
Virus bulletin 2011 Conference Paper - Browser Exploit Packs - Exploitation T...Virus bulletin 2011 Conference Paper - Browser Exploit Packs - Exploitation T...
Virus bulletin 2011 Conference Paper - Browser Exploit Packs - Exploitation T...
Aditya K Sood
 
презентация туристский кластер
презентация туристский кластерпрезентация туристский кластер
презентация туристский кластер
Alexandr Gorunov
 

Viewers also liked (12)

Project 10 B Pw
Project 10 B PwProject 10 B Pw
Project 10 B Pw
 
Ws B 1 S.Bressaud
Ws B 1 S.BressaudWs B 1 S.Bressaud
Ws B 1 S.Bressaud
 
Creative Commons
Creative CommonsCreative Commons
Creative Commons
 
[2013 CodeEngn Conference 08] manGoo - Windows 8 Exploit
[2013 CodeEngn Conference 08] manGoo - Windows 8 Exploit[2013 CodeEngn Conference 08] manGoo - Windows 8 Exploit
[2013 CodeEngn Conference 08] manGoo - Windows 8 Exploit
 
Networking на конференциях
Networking на конференцияхNetworking на конференциях
Networking на конференциях
 
Antisocial people
Antisocial peopleAntisocial people
Antisocial people
 
Поршневой жидкостный насос
Поршневой жидкостный насосПоршневой жидкостный насос
Поршневой жидкостный насос
 
Sp ws1 ulrich teichler
Sp ws1 ulrich teichlerSp ws1 ulrich teichler
Sp ws1 ulrich teichler
 
Anti social behaviour powerpoint (1)
Anti social behaviour powerpoint (1)Anti social behaviour powerpoint (1)
Anti social behaviour powerpoint (1)
 
IT Security and Wire Fraud Awareness Slide Deck
IT Security and Wire Fraud Awareness Slide DeckIT Security and Wire Fraud Awareness Slide Deck
IT Security and Wire Fraud Awareness Slide Deck
 
Virus bulletin 2011 Conference Paper - Browser Exploit Packs - Exploitation T...
Virus bulletin 2011 Conference Paper - Browser Exploit Packs - Exploitation T...Virus bulletin 2011 Conference Paper - Browser Exploit Packs - Exploitation T...
Virus bulletin 2011 Conference Paper - Browser Exploit Packs - Exploitation T...
 
презентация туристский кластер
презентация туристский кластерпрезентация туристский кластер
презентация туристский кластер
 

Similar to Powering your website with realtime data

Powering your website with realtime data
Powering your website with realtime dataPowering your website with realtime data
Powering your website with realtime data
becoded
 
XMPP Intro 1101 - 2008
XMPP Intro 1101 - 2008XMPP Intro 1101 - 2008
XMPP Intro 1101 - 2008
Steffen Larsen
 
2016-05-12 DCRUG React.rb
2016-05-12 DCRUG React.rb2016-05-12 DCRUG React.rb
2016-05-12 DCRUG React.rb
awwaiid
 
EAD Revision Progress Report, 2012-08-08
EAD Revision Progress Report, 2012-08-08EAD Revision Progress Report, 2012-08-08
EAD Revision Progress Report, 2012-08-08
Michael Rush
 
What's new in PHP 5.5
What's new in PHP 5.5What's new in PHP 5.5
What's new in PHP 5.5
Tom Corrigan
 
IBM dwLive, "Internet & HTTP - 잃어버린 패킷을 찾아서..."
IBM dwLive, "Internet & HTTP - 잃어버린 패킷을 찾아서..."IBM dwLive, "Internet & HTTP - 잃어버린 패킷을 찾아서..."
IBM dwLive, "Internet & HTTP - 잃어버린 패킷을 찾아서..."
Dongwook Lee
 
Into The Box 2018 Ortus Keynote
Into The Box 2018 Ortus KeynoteInto The Box 2018 Ortus Keynote
Into The Box 2018 Ortus Keynote
Ortus Solutions, Corp
 
The basics of fluentd
The basics of fluentdThe basics of fluentd
The basics of fluentd
Treasure Data, Inc.
 
NLP Project Full Circle
NLP Project Full CircleNLP Project Full Circle
NLP Project Full Circle
Vsevolod Dyomkin
 
Introduction to blogging with Jekyll
Introduction to blogging with JekyllIntroduction to blogging with Jekyll
Introduction to blogging with Jekyll
Eric Lathrop
 
Ruby on Rails - Pengenalan kepada “permata” dalam pengaturcaraan
Ruby on Rails - Pengenalan kepada “permata” dalam pengaturcaraan  Ruby on Rails - Pengenalan kepada “permata” dalam pengaturcaraan
Ruby on Rails - Pengenalan kepada “permata” dalam pengaturcaraan
edthix
 
Fluentd - RubyKansai 65
Fluentd - RubyKansai 65Fluentd - RubyKansai 65
Fluentd - RubyKansai 65
N Masahiro
 
The Devil and HTML5
The Devil and HTML5The Devil and HTML5
The Devil and HTML5
Myles Braithwaite
 
Html5 intro
Html5 introHtml5 intro
Html5 intro
Kevin DeRudder
 
WordCamp Montreal 2016 WP-API + React with server rendering
WordCamp Montreal 2016  WP-API + React with server renderingWordCamp Montreal 2016  WP-API + React with server rendering
WordCamp Montreal 2016 WP-API + React with server rendering
Ziad Saab
 
Build your LDAP Web Interface with LinID Directory Manager
Build your LDAP Web Interface with LinID Directory ManagerBuild your LDAP Web Interface with LinID Directory Manager
Build your LDAP Web Interface with LinID Directory Manager
LDAPCon
 
Documentation 2.0: DIY Content Delivery and Feedback in Real-time
Documentation 2.0: DIY Content Delivery and Feedback in Real-timeDocumentation 2.0: DIY Content Delivery and Feedback in Real-time
Documentation 2.0: DIY Content Delivery and Feedback in Real-time
lykhinin
 
Hartwarming lightning talk in winter Sapporo
Hartwarming lightning talk in winter SapporoHartwarming lightning talk in winter Sapporo
Hartwarming lightning talk in winter Sapporo
Jun OHWADA
 
Performance optimization - Advanced techniques
Performance optimization - Advanced techniquesPerformance optimization - Advanced techniques
Performance optimization - Advanced techniques
Filip Mares
 
Lone StarPHP 2013 - Building Web Apps from a New Angle
Lone StarPHP 2013 - Building Web Apps from a New AngleLone StarPHP 2013 - Building Web Apps from a New Angle
Lone StarPHP 2013 - Building Web Apps from a New Angle
Pablo Godel
 

Similar to Powering your website with realtime data (20)

Powering your website with realtime data
Powering your website with realtime dataPowering your website with realtime data
Powering your website with realtime data
 
XMPP Intro 1101 - 2008
XMPP Intro 1101 - 2008XMPP Intro 1101 - 2008
XMPP Intro 1101 - 2008
 
2016-05-12 DCRUG React.rb
2016-05-12 DCRUG React.rb2016-05-12 DCRUG React.rb
2016-05-12 DCRUG React.rb
 
EAD Revision Progress Report, 2012-08-08
EAD Revision Progress Report, 2012-08-08EAD Revision Progress Report, 2012-08-08
EAD Revision Progress Report, 2012-08-08
 
What's new in PHP 5.5
What's new in PHP 5.5What's new in PHP 5.5
What's new in PHP 5.5
 
IBM dwLive, "Internet & HTTP - 잃어버린 패킷을 찾아서..."
IBM dwLive, "Internet & HTTP - 잃어버린 패킷을 찾아서..."IBM dwLive, "Internet & HTTP - 잃어버린 패킷을 찾아서..."
IBM dwLive, "Internet & HTTP - 잃어버린 패킷을 찾아서..."
 
Into The Box 2018 Ortus Keynote
Into The Box 2018 Ortus KeynoteInto The Box 2018 Ortus Keynote
Into The Box 2018 Ortus Keynote
 
The basics of fluentd
The basics of fluentdThe basics of fluentd
The basics of fluentd
 
NLP Project Full Circle
NLP Project Full CircleNLP Project Full Circle
NLP Project Full Circle
 
Introduction to blogging with Jekyll
Introduction to blogging with JekyllIntroduction to blogging with Jekyll
Introduction to blogging with Jekyll
 
Ruby on Rails - Pengenalan kepada “permata” dalam pengaturcaraan
Ruby on Rails - Pengenalan kepada “permata” dalam pengaturcaraan  Ruby on Rails - Pengenalan kepada “permata” dalam pengaturcaraan
Ruby on Rails - Pengenalan kepada “permata” dalam pengaturcaraan
 
Fluentd - RubyKansai 65
Fluentd - RubyKansai 65Fluentd - RubyKansai 65
Fluentd - RubyKansai 65
 
The Devil and HTML5
The Devil and HTML5The Devil and HTML5
The Devil and HTML5
 
Html5 intro
Html5 introHtml5 intro
Html5 intro
 
WordCamp Montreal 2016 WP-API + React with server rendering
WordCamp Montreal 2016  WP-API + React with server renderingWordCamp Montreal 2016  WP-API + React with server rendering
WordCamp Montreal 2016 WP-API + React with server rendering
 
Build your LDAP Web Interface with LinID Directory Manager
Build your LDAP Web Interface with LinID Directory ManagerBuild your LDAP Web Interface with LinID Directory Manager
Build your LDAP Web Interface with LinID Directory Manager
 
Documentation 2.0: DIY Content Delivery and Feedback in Real-time
Documentation 2.0: DIY Content Delivery and Feedback in Real-timeDocumentation 2.0: DIY Content Delivery and Feedback in Real-time
Documentation 2.0: DIY Content Delivery and Feedback in Real-time
 
Hartwarming lightning talk in winter Sapporo
Hartwarming lightning talk in winter SapporoHartwarming lightning talk in winter Sapporo
Hartwarming lightning talk in winter Sapporo
 
Performance optimization - Advanced techniques
Performance optimization - Advanced techniquesPerformance optimization - Advanced techniques
Performance optimization - Advanced techniques
 
Lone StarPHP 2013 - Building Web Apps from a New Angle
Lone StarPHP 2013 - Building Web Apps from a New AngleLone StarPHP 2013 - Building Web Apps from a New Angle
Lone StarPHP 2013 - Building Web Apps from a New Angle
 

Recently uploaded

Energy Efficient Video Encoding for Cloud and Edge Computing Instances
Energy Efficient Video Encoding for Cloud and Edge Computing InstancesEnergy Efficient Video Encoding for Cloud and Edge Computing Instances
Energy Efficient Video Encoding for Cloud and Edge Computing Instances
Alpen-Adria-Universität
 
9 CEO's who hit $100m ARR Share Their Top Growth Tactics Nathan Latka, Founde...
9 CEO's who hit $100m ARR Share Their Top Growth Tactics Nathan Latka, Founde...9 CEO's who hit $100m ARR Share Their Top Growth Tactics Nathan Latka, Founde...
9 CEO's who hit $100m ARR Share Their Top Growth Tactics Nathan Latka, Founde...
saastr
 
Overcoming the PLG Trap: Lessons from Canva's Head of Sales & Head of EMEA Da...
Overcoming the PLG Trap: Lessons from Canva's Head of Sales & Head of EMEA Da...Overcoming the PLG Trap: Lessons from Canva's Head of Sales & Head of EMEA Da...
Overcoming the PLG Trap: Lessons from Canva's Head of Sales & Head of EMEA Da...
saastr
 
Choosing The Best AWS Service For Your Website + API.pptx
Choosing The Best AWS Service For Your Website + API.pptxChoosing The Best AWS Service For Your Website + API.pptx
Choosing The Best AWS Service For Your Website + API.pptx
Brandon Minnick, MBA
 
5th LF Energy Power Grid Model Meet-up Slides
5th LF Energy Power Grid Model Meet-up Slides5th LF Energy Power Grid Model Meet-up Slides
5th LF Energy Power Grid Model Meet-up Slides
DanBrown980551
 
June Patch Tuesday
June Patch TuesdayJune Patch Tuesday
June Patch Tuesday
Ivanti
 
[OReilly Superstream] Occupy the Space: A grassroots guide to engineering (an...
[OReilly Superstream] Occupy the Space: A grassroots guide to engineering (an...[OReilly Superstream] Occupy the Space: A grassroots guide to engineering (an...
[OReilly Superstream] Occupy the Space: A grassroots guide to engineering (an...
Jason Yip
 
Biomedical Knowledge Graphs for Data Scientists and Bioinformaticians
Biomedical Knowledge Graphs for Data Scientists and BioinformaticiansBiomedical Knowledge Graphs for Data Scientists and Bioinformaticians
Biomedical Knowledge Graphs for Data Scientists and Bioinformaticians
Neo4j
 
Essentials of Automations: Exploring Attributes & Automation Parameters
Essentials of Automations: Exploring Attributes & Automation ParametersEssentials of Automations: Exploring Attributes & Automation Parameters
Essentials of Automations: Exploring Attributes & Automation Parameters
Safe Software
 
GraphRAG for LifeSciences Hands-On with the Clinical Knowledge Graph
GraphRAG for LifeSciences Hands-On with the Clinical Knowledge GraphGraphRAG for LifeSciences Hands-On with the Clinical Knowledge Graph
GraphRAG for LifeSciences Hands-On with the Clinical Knowledge Graph
Neo4j
 
Apps Break Data
Apps Break DataApps Break Data
Apps Break Data
Ivo Velitchkov
 
Freshworks Rethinks NoSQL for Rapid Scaling & Cost-Efficiency
Freshworks Rethinks NoSQL for Rapid Scaling & Cost-EfficiencyFreshworks Rethinks NoSQL for Rapid Scaling & Cost-Efficiency
Freshworks Rethinks NoSQL for Rapid Scaling & Cost-Efficiency
ScyllaDB
 
Y-Combinator seed pitch deck template PP
Y-Combinator seed pitch deck template PPY-Combinator seed pitch deck template PP
Y-Combinator seed pitch deck template PP
c5vrf27qcz
 
Northern Engraving | Nameplate Manufacturing Process - 2024
Northern Engraving | Nameplate Manufacturing Process - 2024Northern Engraving | Nameplate Manufacturing Process - 2024
Northern Engraving | Nameplate Manufacturing Process - 2024
Northern Engraving
 
Columbus Data & Analytics Wednesdays - June 2024
Columbus Data & Analytics Wednesdays - June 2024Columbus Data & Analytics Wednesdays - June 2024
Columbus Data & Analytics Wednesdays - June 2024
Jason Packer
 
"Frontline Battles with DDoS: Best practices and Lessons Learned", Igor Ivaniuk
"Frontline Battles with DDoS: Best practices and Lessons Learned",  Igor Ivaniuk"Frontline Battles with DDoS: Best practices and Lessons Learned",  Igor Ivaniuk
"Frontline Battles with DDoS: Best practices and Lessons Learned", Igor Ivaniuk
Fwdays
 
What is an RPA CoE? Session 1 – CoE Vision
What is an RPA CoE?  Session 1 – CoE VisionWhat is an RPA CoE?  Session 1 – CoE Vision
What is an RPA CoE? Session 1 – CoE Vision
DianaGray10
 
GNSS spoofing via SDR (Criptored Talks 2024)
GNSS spoofing via SDR (Criptored Talks 2024)GNSS spoofing via SDR (Criptored Talks 2024)
GNSS spoofing via SDR (Criptored Talks 2024)
Javier Junquera
 
“How Axelera AI Uses Digital Compute-in-memory to Deliver Fast and Energy-eff...
“How Axelera AI Uses Digital Compute-in-memory to Deliver Fast and Energy-eff...“How Axelera AI Uses Digital Compute-in-memory to Deliver Fast and Energy-eff...
“How Axelera AI Uses Digital Compute-in-memory to Deliver Fast and Energy-eff...
Edge AI and Vision Alliance
 
Crafting Excellence: A Comprehensive Guide to iOS Mobile App Development Serv...
Crafting Excellence: A Comprehensive Guide to iOS Mobile App Development Serv...Crafting Excellence: A Comprehensive Guide to iOS Mobile App Development Serv...
Crafting Excellence: A Comprehensive Guide to iOS Mobile App Development Serv...
Pitangent Analytics & Technology Solutions Pvt. Ltd
 

Recently uploaded (20)

Energy Efficient Video Encoding for Cloud and Edge Computing Instances
Energy Efficient Video Encoding for Cloud and Edge Computing InstancesEnergy Efficient Video Encoding for Cloud and Edge Computing Instances
Energy Efficient Video Encoding for Cloud and Edge Computing Instances
 
9 CEO's who hit $100m ARR Share Their Top Growth Tactics Nathan Latka, Founde...
9 CEO's who hit $100m ARR Share Their Top Growth Tactics Nathan Latka, Founde...9 CEO's who hit $100m ARR Share Their Top Growth Tactics Nathan Latka, Founde...
9 CEO's who hit $100m ARR Share Their Top Growth Tactics Nathan Latka, Founde...
 
Overcoming the PLG Trap: Lessons from Canva's Head of Sales & Head of EMEA Da...
Overcoming the PLG Trap: Lessons from Canva's Head of Sales & Head of EMEA Da...Overcoming the PLG Trap: Lessons from Canva's Head of Sales & Head of EMEA Da...
Overcoming the PLG Trap: Lessons from Canva's Head of Sales & Head of EMEA Da...
 
Choosing The Best AWS Service For Your Website + API.pptx
Choosing The Best AWS Service For Your Website + API.pptxChoosing The Best AWS Service For Your Website + API.pptx
Choosing The Best AWS Service For Your Website + API.pptx
 
5th LF Energy Power Grid Model Meet-up Slides
5th LF Energy Power Grid Model Meet-up Slides5th LF Energy Power Grid Model Meet-up Slides
5th LF Energy Power Grid Model Meet-up Slides
 
June Patch Tuesday
June Patch TuesdayJune Patch Tuesday
June Patch Tuesday
 
[OReilly Superstream] Occupy the Space: A grassroots guide to engineering (an...
[OReilly Superstream] Occupy the Space: A grassroots guide to engineering (an...[OReilly Superstream] Occupy the Space: A grassroots guide to engineering (an...
[OReilly Superstream] Occupy the Space: A grassroots guide to engineering (an...
 
Biomedical Knowledge Graphs for Data Scientists and Bioinformaticians
Biomedical Knowledge Graphs for Data Scientists and BioinformaticiansBiomedical Knowledge Graphs for Data Scientists and Bioinformaticians
Biomedical Knowledge Graphs for Data Scientists and Bioinformaticians
 
Essentials of Automations: Exploring Attributes & Automation Parameters
Essentials of Automations: Exploring Attributes & Automation ParametersEssentials of Automations: Exploring Attributes & Automation Parameters
Essentials of Automations: Exploring Attributes & Automation Parameters
 
GraphRAG for LifeSciences Hands-On with the Clinical Knowledge Graph
GraphRAG for LifeSciences Hands-On with the Clinical Knowledge GraphGraphRAG for LifeSciences Hands-On with the Clinical Knowledge Graph
GraphRAG for LifeSciences Hands-On with the Clinical Knowledge Graph
 
Apps Break Data
Apps Break DataApps Break Data
Apps Break Data
 
Freshworks Rethinks NoSQL for Rapid Scaling & Cost-Efficiency
Freshworks Rethinks NoSQL for Rapid Scaling & Cost-EfficiencyFreshworks Rethinks NoSQL for Rapid Scaling & Cost-Efficiency
Freshworks Rethinks NoSQL for Rapid Scaling & Cost-Efficiency
 
Y-Combinator seed pitch deck template PP
Y-Combinator seed pitch deck template PPY-Combinator seed pitch deck template PP
Y-Combinator seed pitch deck template PP
 
Northern Engraving | Nameplate Manufacturing Process - 2024
Northern Engraving | Nameplate Manufacturing Process - 2024Northern Engraving | Nameplate Manufacturing Process - 2024
Northern Engraving | Nameplate Manufacturing Process - 2024
 
Columbus Data & Analytics Wednesdays - June 2024
Columbus Data & Analytics Wednesdays - June 2024Columbus Data & Analytics Wednesdays - June 2024
Columbus Data & Analytics Wednesdays - June 2024
 
"Frontline Battles with DDoS: Best practices and Lessons Learned", Igor Ivaniuk
"Frontline Battles with DDoS: Best practices and Lessons Learned",  Igor Ivaniuk"Frontline Battles with DDoS: Best practices and Lessons Learned",  Igor Ivaniuk
"Frontline Battles with DDoS: Best practices and Lessons Learned", Igor Ivaniuk
 
What is an RPA CoE? Session 1 – CoE Vision
What is an RPA CoE?  Session 1 – CoE VisionWhat is an RPA CoE?  Session 1 – CoE Vision
What is an RPA CoE? Session 1 – CoE Vision
 
GNSS spoofing via SDR (Criptored Talks 2024)
GNSS spoofing via SDR (Criptored Talks 2024)GNSS spoofing via SDR (Criptored Talks 2024)
GNSS spoofing via SDR (Criptored Talks 2024)
 
“How Axelera AI Uses Digital Compute-in-memory to Deliver Fast and Energy-eff...
“How Axelera AI Uses Digital Compute-in-memory to Deliver Fast and Energy-eff...“How Axelera AI Uses Digital Compute-in-memory to Deliver Fast and Energy-eff...
“How Axelera AI Uses Digital Compute-in-memory to Deliver Fast and Energy-eff...
 
Crafting Excellence: A Comprehensive Guide to iOS Mobile App Development Serv...
Crafting Excellence: A Comprehensive Guide to iOS Mobile App Development Serv...Crafting Excellence: A Comprehensive Guide to iOS Mobile App Development Serv...
Crafting Excellence: A Comprehensive Guide to iOS Mobile App Development Serv...
 

Powering your website with realtime data

  • 1. Powering your website with realtime data Bert Van Hauwaert bert@becoded.be - @tbotwit Sunday 26 February 2012
  • 2. 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
  • 3. Overview • The old days • XMPP • Install server • Configure apache • Libraries • Examples Sunday 26 February 2012
  • 4. Overview • The old days • XMPP • Install server • Configure apache • Libraries • Examples Sunday 26 February 2012
  • 5. The old days • <meta http-equiv=”refresh” content=”5” /> • <script > • AJAX Sunday 26 February 2012
  • 6. Overview • The old days • XMPP • Install server • Configure apache • Libraries • Examples Sunday 26 February 2012
  • 7. Websockets Source: http://caniuse.com/#feat=websockets Sunday 26 February 2012
  • 8. XMPP: what • Extensible Messaging and Presence Protocol • Jabber • XML • Client - Server - Component Sunday 26 February 2012
  • 9. XMPP: stanzas • <presence> • <message> • <iq> Sunday 26 February 2012
  • 10. XMPP: stanzas • <presence> • <message> • <iq> Sunday 26 February 2012
  • 11. XMPP: stanzas • <presence> • <message> • <iq> Sunday 26 February 2012
  • 12. XMPP: stanzas • <presence> • <message> • <iq> Sunday 26 February 2012
  • 13. XMPP: addressing • JID (Jabber Identifier) • Three main parts • [ node "@" ] domain [ "/" resource ] Sunday 26 February 2012
  • 14. XMPP: extensions • XMPP Extension Protocol - XEP • http://xmpp.org/xmpp-protocols/xmpp-extensions/ Sunday 26 February 2012
  • 15. XMPP: advantages • Open • Decentralized • Secure • Extensible Sunday 26 February 2012
  • 16. XMPP: disadvantages • Statefulness • Overhead Sunday 26 February 2012
  • 17. XMPP: example <stream:stream> <iq type="get" id="roster1"> <query xmlns:"jabber:iq:roster" /> </iq> <presence /> <message to="attendees@phpukconference.com" from="bert@becoded.be/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
  • 18. XMPP: example <stream:stream> <iq type="get" id="roster1"> <query xmlns:"jabber:iq:roster" /> </iq> <presence /> <message to="attendees@phpukconference.com" from="bert@becoded.be/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
  • 19. XMPP: example <stream:stream> <iq type="get" id="roster1"> <query xmlns:"jabber:iq:roster" /> </iq> <presence /> <message to="attendees@phpukconference.com" from="bert@becoded.be/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
  • 20. XMPP: example <stream:stream> <iq type="get" id="roster1"> <query xmlns:"jabber:iq:roster" /> </iq> <presence /> <message to="attendees@phpukconference.com" from="bert@becoded.be/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
  • 21. XMPP: example <stream:stream> <iq type="get" id="roster1"> <query xmlns:"jabber:iq:roster" /> </iq> <presence /> <message to="attendees@phpukconference.com" from="bert@becoded.be/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
  • 22. XMPP: example <stream:stream> <iq type="get" id="roster1"> <query xmlns:"jabber:iq:roster" /> </iq> <presence /> <message to="attendees@phpukconference.com" from="bert@becoded.be/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
  • 23. XMPP: example <stream:stream> <iq type="get" id="roster1"> <query xmlns:"jabber:iq:roster" /> </iq> <presence /> <message to="attendees@phpukconference.com" from="bert@becoded.be/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
  • 24. XMPP: XEP-0060 (1) • PubSub (Publish / Subscribe) • Bandwidth / resources Sunday 26 February 2012
  • 25. XMPP: XEP-0060 (2) <iq from="child@holiday.com/car" id="ams9nz78" to="pubsub.holiday.com" type="set"> <pubsub xmlns="http://jabber.org/ protocol/pubsub"> <subscribe node="are-we-there-yet" jid="child@holiday.com"/> </pubsub> </iq> Sunday 26 February 2012
  • 26. XMPP: XEP-0060 (3) <iq from="adult@holiday.com/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
  • 27. XMPP: XEP-0060 (4) <message from="pubsub.holiday.com" to="child@holiday.com"> <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
  • 28. XMPP: XEP-0045 (1) • MUC / Multi-User Chat • “Multiplier” Sunday 26 February 2012
  • 29. XMPP: XEP-0045 (2) <presence from="user@domain.com/resource" to="room@conference.muc.com/nickname"> <x xmlns= "http://jabber.org/protocol/muc"/> </presence> Sunday 26 February 2012
  • 30. XMPP: XEP-0045 (3) <message to="room@conference.muc.com" from="user@domain.com/resource" type="groupchat "> <body>Lorem Ipsum</body> </message> <message to="otherUser@domain.com/resource" from="room@conference.muc.com/nickname" type="groupchat "> <body>Lorem Ipsum</body> </message> Sunday 26 February 2012
  • 31. Overview • The old days • XMPP • Install server • Configure apache • Libraries • Examples Sunday 26 February 2012
  • 32. Install server: starting point • Debian • web server • SQL database • SSH server Sunday 26 February 2012
  • 33. Install server: apt sources • apt-get install vim • vim /etc/apt/sources.list • deb http://ftp.belnet.be/debian/ squeeze main non-free deb-src http://ftp.belnet.be/debian/ squeeze main deb http://security.debian.org/ squeeze/updates main non-free deb-src http://security.debian.org/ squeeze/updates main deb http://packages.dotdeb.org stable all deb-src http://packages.dotdeb.org stable all Sunday 26 February 2012
  • 34. 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
  • 35. 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
  • 36. 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
  • 37. Install server: Openfire (2) • http://[server-ip]:9090/ Sunday 26 February 2012
  • 45. Install server: Openfire (3) • Plugins • User Service • Monitoring Service Sunday 26 February 2012
  • 46. Overview • The old days • XMPP • Install server • Configure apache • Libraries • Examples Sunday 26 February 2012
  • 47. Configure apache: why (1) Client - polling ta ta ta data no da no da no da Server d ata w ne Client - long polling data Sunday 26 February 2012
  • 48. Configure apache: why (2) • BOSH (Bidirectional streams Over Synchronous HTTP) Sunday 26 February 2012
  • 49. 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
  • 50. Configure apache: proxy (2) <VirtualHost *:80> Options FollowSymLinks ServerAdmin bert@becoded.be 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 rule ProxyRequests Off ProxyPass /bind http://127.0.0.1:7070/http-bind/ ProxyPassReverse /bind http://127.0.0.1:7070/http-bind/ </VirtualHost> Sunday 26 February 2012
  • 51. Overview • The old days • XMPP • Install server • Configure apache • Libraries • Examples Sunday 26 February 2012
  • 52. 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
  • 53. 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
  • 54. 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
  • 55. Libraries: Strophe.js var 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
  • 56. Overview • The old days • XMPP • Install server • Configure apache • Libraries • Examples Sunday 26 February 2012
  • 57. Examples: setup Sunday 26 February 2012
  • 59. Examples: messages • Browser • Log • Adium Sunday 26 February 2012
  • 64. 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
  • 65. Example: IQ ping pong (2) this.sendPing = function (to) { var me = this; <iq to='demo' type='get' var iq = $iq({ id='pingPong' to to, : xmlns='jabber:client'> type : 'get', <ping id : 'pingPong' xmlns='urn:xmpp:ping'/> }).c('ping', </iq> {xmlns: 'urn:xmpp:ping'}); me.connection.send(iq); }; Sunday 26 February 2012
  • 66. 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
  • 70. 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
  • 71. 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
  • 72. 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
  • 73. 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
  • 76. 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
  • 81. Example: prebind BOSH (1) • SID - RID • Security • User friendly • Performance • Persisting Sunday 26 February 2012
  • 82. 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
  • 88. Thank you • bert@becoded.be • Code: https://github.com/becoded/talk-xmpp-demo • Slides: Slideshare • Rate / comments: http://joind.in Sunday 26 February 2012
  • 91. Questions ? ? ? ? Sunday 26 February 2012