View Single Post
  #1 (permalink)  
Old May 16th, 2013, 11:25 PM
drayarms drayarms is offline
Authorized User
Points: 182, Level: 3
Points: 182, Level: 3 Points: 182, Level: 3 Points: 182, Level: 3
Activity: 0%
Activity: 0% Activity: 0% Activity: 0%
 
Join Date: May 2013
Posts: 40
Thanks: 0
Thanked 0 Times in 0 Posts
Default Not all browsers successfully establish a connection

I just got started with XMPP, so please bare with me if I don't make much sense. I built a simple script to connect to the jabber.org server, based on the hello.js example in chapter 3 of the book. I uploaded the entire scripts folder to my server from the code resources, containing the strophe and affiliated libraries. Everything works perfectly in chrome and IE. However, connection can't be established on all other major desktop and mobile(iphone)browsers. i thought the strophe library was cross browser compatible. Anyone else has this issue or knows how to remedy the situation?

I'm going to include the modified hello.html, hello.js and hello.css files below.

hello.html or hello.php
Code:
<!DOCTYPE html>
<html>
  <head>
    <title>Hello - Chapter 3</title>
    
    <script type = "text/javascript" src="http://code.jquery.com/jquery-latest.js"> </script>



    <!--include JQM-->
    <meta name="viewport" content="width=device-width, minimum-scale=1, maximum-scale=1"> 
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.0-rc.1/jquery.mobile-1.3.0-rc.1.min.css" />
    <script src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
    <script src="http://code.jquery.com/mobile/1.3.0-rc.1/jquery.mobile-1.3.0-rc.1.min.js"></script>



    <!--include strophe and flxhr-->

    <script src='scripts/strophe.js'></script>
    <script src='scripts/flXHR.js'></script>
    <script src='scripts/strophe.flxhr.js'></script>



    <link rel='stylesheet' href='hello.css'>

    <script src='hello.js'></script>


  </head>
  <body>
    <h1>Hello</h1>

    <div id='log'>
    </div>

    <!-- login dialog -->
    <div id='login_dialog' class=''>
      <label>JID:</label><input type='text' id='jid'>
      <label>Password:</label><input type='password' id='password'>
      <button>Submit</button>
    </div>
  </body>
</html>

hello.css

Code:
body {
    font-family: Helvetica;
}

h1 {
    text-align: center;
}

.hidden {
    display: none;
}

#log {
    width:300px;height:300px;color:red;border:1px solid black;
}

hello.js

Code:
var Hello = {
    connection: null,
    start_time: null,

    log: function (msg) {
        $('#log').append("<p>" + msg + "</p>");
    },

    send_ping: function (to) {
        var ping = $iq({
            to: to,
            type: "get",
            id: "ping1"}).c("ping", {xmlns: "urn:xmpp:ping"});

        Hello.log("Sending ping to " + to + ".");

        Hello.start_time = (new Date()).getTime();
        Hello.connection.send(ping);
    },

    handle_pong: function (iq) {
        var elapsed = (new Date()).getTime() - Hello.start_time;
        Hello.log("Received pong from server in " + elapsed + "ms.");

        Hello.connection.disconnect();
        
        return false;
    }
};

$(document).ready(function () {

	$('#login_dialog button').click(function(){


		Hello.log("connecting...");

                $(document).trigger('connect', {
                    jid: $('#jid').val(),
                    password: $('#password').val()
                });		

	});

});

$(document).bind('connect', function (ev, data) {
    var conn = new Strophe.Connection(
        "http://bosh.metajack.im:5280/xmpp-httpbind");

    conn.connect(data.jid, data.password, function (status) {
        if (status === Strophe.Status.CONNECTED) {
            $(document).trigger('connected');
        } else if (status === Strophe.Status.DISCONNECTED) {
            $(document).trigger('disconnected');
        }
    });

    Hello.connection = conn;
});

$(document).bind('connected', function () {
    // inform the user
    Hello.log("Connection established.");



    Hello.log("Full jid is: " + Hello.connection.jid + ".");

    Hello.log("Domain is: " + Strophe.getDomainFromJid(Hello.connection.jid) + ".");

    Hello.log("Resource is: " + Strophe.getResourceFromJid(Hello.connection.jid) + ".");

    Hello.log("Bare jid is: " + Strophe.getBareJidFromJid(Hello.connection.jid) + ".");

    Hello.connection.addHandler(Hello.handle_pong, null, "iq", null, "ping1");

    var domain = Strophe.getDomainFromJid(Hello.connection.jid);
    
    Hello.send_ping(domain);

});

$(document).bind('disconnected', function () {
    Hello.log("Connection terminated.");

    // remove dead connection object
    Hello.connection = null;
});

Thanks