0

Good morning everyone I come here today with some questions in hopes that someone can help me through.

The problem:
At my work, I am requiered to create a chat app for mobile using html5 and websockets.

We have a custom made chat app for desktop in the company which works fine, on a server there is an application that is listening to the clients requests. There, everything works fine.

What I need is to be able to communicate the mobile app to the desktop apps. But i don't know where to begin.

Can someone provide some information or some links on how to do this.

Thanks in advance.

4
Contributors
4
Replies
28
Views
3 Years
Discussion Span
Last Post by PubNub
1

If you have full control of your server/environment (which it sounds like you might) I would most likely use node.js with the Socket.io plugin. The reason I ask about whether you have your own server, is because a lot of hosts out there still don't support installs of Node.js. Building a chat application by it self would probably not be where the real strugle comes, but rather trying to intergrate with an your existing chat application you have already in place at work.

Here is a good tutorial from Nettuts on using Node and Socket.io to create a real-time chat application.
http://net.tutsplus.com/tutorials/javascript-ajax/using-node-js-and-websockets-to-build-a-chat-service/

2

WebSockets HTML5: A Simple Chat App

You can build real-time chat in a few lines of JavaScript pretty quick, and then integrate with your backend services ( your desktop app for example ) in a few more steps. This is the quickest way to write a real-time chat application on web or mobile. Tasks, such as sending and receiving data, take only one function call.

Full Example hosted here: Build Real-time Chat Apps in 10 Lines of Code

Enter Chat and press enter:
<div><input id="input" placeholder="you-chat-here"></div>

Chat Output:
<div id="box"></div>

<script src=http://cdn.pubnub.com/pubnub.min.js></script>
<script>(function(){
    var box     = PUBNUB.$('box'), 
    ,   input   = PUBNUB.$('input')
    ,   channel = 'chat';

    PUBNUB.subscribe({
        channel : channel,
        callback : function(text) { 
            box.innerHTML = 
            (''+text).replace( /[<>]/g, '' ) + '<br>' +
            box.innerHTML 
        }
    });

    PUBNUB.bind( 'keyup', input, function(e) {
        (e.keyCode || e.charCode) === 13 && PUBNUB.publish({
            channel : channel,
            message : input.value,
            x : (input.value='')
        })
    } );
})()</script>

So on the bind( 'keyup'... section you can directly chat P2P style, or instead you can post the chat message directly to your server via AJAX+JSON via CORS1/2 or JSONP if cross domain. If you are using jQuery then you can use the following:

var url = "http://URL_HERE?message="+escape(input.value);
$.getJSON( url, function(data) {
    console.log( "success", data );
})
.fail(function(e) {
    console.log( "error", e );
})

Then via your server (say you are running PHP) you can use the following to push our to the Web Connected Client:

$pubnub->publish(array(
    'channel' => 'chat',
    'message' => 'message text here'
));

// also send via Desktop Push mechanism (XMPP?)

That's a good starting point. There's more to it but send me a note at https://twitter.com/stephenlb if you have feedback or questions.

Edited by PubNub: whitespace needed and completed a sentence. and a sample link. also added a few details about the desktop app.

Votes + Comments
Nice example
This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.