architecture to Facebook-chat from a webpage, (XMPP? Strophe? Punjab?)

Question

I would like to implement FB-chat inside a webpage. I looked around in Facebook API, i found out that chat is allowed only using XMPP. First I tried to connect to FB-chat using Pidgin and it worked fine. My conclusion was that FB-chat server is acting as the XMPP server. Is this true?

I read about XMPP, it seems that an open TCP connection should be established between the client and the server to exchange the XML stanzas which is not possible from a website (over JavaScript and without plugins) since only http requests/responses can be exchanges, no TCP connection there. This means that there should be some kind of a proxy in between, and as for authentication, FB API suggests to use the X-FACEBOOK-PLATFORM SASL (not the DIGEST MD5, since there is a proxy). I didn't find a clear tutorial or steps how to do so, help here is appreciated.

A bit more research about XMPP client from the web or browser, I saw that I am supposed to use a library called Strophe (based on BOSH protocol) and in other answers some kind of connection manager called Punjab. I read about this BOSH protocol, it seems to be the solution but in some places I found out that it is not allowed in FB (I am not sure how correct is this info though). I tried to setup these but i was totally confused how to begin and what I am really supposed to do.

For the strophe, I didn't find a real tutorial how to implement it, and in what i found, they suggest to first setup a jabber server like ejabberd (I didnt get the need for that).

My question is:

Can somebody suggest an architecture that I should implement to achieve my goal?

So will there be: webpage ->(HTTP) -> Strophe -> (TCP) -> FB-chat OR will it have an XMPP server in between and why?

I would appreciate any answer to any of my questions. Please suggest some links to how to implement all these stuff. I am totally new to all this which made me lost for more than a week now.

If somebody already did this, please help. Thanks a lot.

Sabah

Descriptive

Answer 1

I'm trying to solve this problem too. So far I have decided on a set up of:

Jappix mini (uses JSJAC.js library) <-> node-xmpp-bosh on node.js on my server <-> Facebook server.

Jappix mini was hard to find but it seems by far the best open source chat bar so worth mentioning here.

I don't have it all set up yet but will update here if I make progress. The main issue will be how to make JSJAC use Facebook API Key authentication. I can't find any info or examples for that, but I found this plugin for strophe library which maybe can be adapted:

https://github.com/rubenjgarciab/turedsocial/blob/master/strophe-plugins/src/facebook.js

Finally, you cannot include your facebook secret key in javascript (because it's a secret!) so you need to use Facebook REST API auth.promoteSession server-side to produce a session-secret key which can be used in the javascript to sign the X-FACEBOOK-PLATFORM auth request.

Hope that helps, I'll add more if/when I get it working.

Trochelminth

thanks @chris14679. I have now this combination working: strophe/js>punjab>XMPP server. I may also try it with node-xmpp-bosh since I use node a lot. For the XMPP Server, it is still not facebook, with gmail and a private jabber it works. Logging in to facebook is a big issue (maybe is not allowed). Be aware of using the REST API, it is being deprecated. If you find a way to log-in to facebook let me know. – Descriptive

and @dwarfy: thank you both for your answers. It works with me using strophe on client side. As connection manager, I can use either punjab or node-xmpp-bosh (I chose this because I am used to node). I also had to use the facebook.js plugin to Strophe but the latest version needed some modification. – Descriptive

Answer 2

Informations about facebook chat server :

Protocol: XMPP or Jabber
Username: mathvdh
Domain: chat.facebook.com
Jabber ID: [email protected]
Password: <your Facebook password>
Port: 5222
Server: chat.facebook.com
Use SSL/TLS: no
Allow plaintext authentication: no

I think strophe and punjab should be a working combination for fb chat, see here : XMPP library for facebook chat

And I think the schema would be more like :

client webpage/js/strophe <-> yourserver/punjab <-> facebook xmpp chat server

Coggins

thanks @Coggins for your quick answer. So what I understood is Strophe is some kind of JS library similar to Jquery that I can include in my page and then use its functions to connect and send messages. In its API link the functions are explained but no examples how can they be used. Do you know if there is such a tutorial or examples? The Punjab will be the BOSH CM in between the server and the client (inside my webpage), also can you suggest a link how to get started? (did I get it right?). thanks a lot – Descriptive

this seems not too bad : slideshare.net/metajack/the-real-time-web-with-xmpp and some notes and code here : ko-kr.facebook.com/note.php?note_id=118657671505760 and also some examples in the github of strophe : github.com/metajack/strophejs/tree/master/examples – Coggins

thank you @Coggins for the pointers to strophe. I am trying now to install punjab and then try the strophe library. A jabber server is a prerequisite to punjab (i don't get what it is needed for) but anyway i will follow the steps and see. – Descriptive

@Coggins Can you please tell me where i have to set this Domain Name , Server , Port and other Parameters ? – Loewe

@Loewe sorry but I don't know what you are talking about ? I don't know I never used this configuration .. – Coggins

@Coggins okay can you please have a look over this thread #8998764 – Loewe

Answer 3

Sabah,

As mentioned in the previous answers the Punjab <-> strophe.js works. I have forked the facebook strophe client here: https://github.com/javierfigueroa/turedsocial and I added an example.

Hope this helps.

Jari

I am tried to run your sample once i have installed strophe & punjab after that i have set the appid,application secret key in facebook.html , after login into facebook , when i pass Facebook Chat JID and password and press connect , i am getting <body xmlns='jabber.org/protocol/httpbind' type='terminate' condition='remote-connection-failed'/> error , can you please help me ? – Loewe

I have set {scope: 'email,user_online_presence,friends_online_presence,xmpp_login'} permissions to the users – Loewe

Hi Hunt, this is probably a cross domain issue. Make sure the requests that go out to facebook from your machine have the same domain as the one specified in the facebook app configuration. If you're running locally PunJab may be sending a "localhost" request. – Jari

Does that require ejabberd or only punjab will do ? – Loewe