Quick notes:
In order to enable BOSH to be able to use converse.js, you need Openfire and another server to handle port 80 requests. BOSH enables Converse to use http to translate the XMPP (not XAMPP) data between the Openfire server and the web browser where Converse.js is being called. There are other guides for Linux machines and Nginx web server. There are also several products like Converse.
Converse alternatives: Strophe or JitsiMeet
XAMPP alternatives: IIS or Nginx
Openfire alternatives: Ejabbered or Prosidy
I have choosen XAMPP, Openfire, and Converse.js because I have played with lot's of different options and have decided that these are the best choices for Windows users (and I have the most tinkering/experience with).
Here are my assumptions (what I am using in my rig):
- Windows x64 machine
- Openfire 3.9.3
- Using built-in database
- XAMPP server
- 7-Zip (to extract .zip files)
- Basic wireless router with Port Forwarding abilities
Directions:
01. Download and build Converse.js
A) This is the hardest step. Good luck
02. Download and install Openfire 3.9.3 (with Java)
A) I installed Openfire to C:\Program Files (x86)\Openfire
B) I set up my server name to my FreeDNS Address.
C) Make sure BOSH is enabled and at port 7070.
03. Download and install XAMPP.
A) I installed to C:\xampp
B) Add to this file: C:\xampp\apache\conf\extra\httpd-vhosts.conf
i) Where "example.com" is either your IP address or your FreeDNS name.
<VirtualHost *:80> ServerName example.com #requests sent to /http-bind will be redirected to localhost:7070 ProxyPass /http-bind http://example.com:7070/http-bind/ ProxyPassReverse /http-bind http://example.com:7070/http-bind/</VirtualHost>
C) Stop the XAMPP server. Then start it again.
D) Add a new file to the default hosting directory of XAMPP ( C:\xampp\htdocs ) called crossdomain.xml that contains:
<?xml version="1.0"?><!DOCTYPE cross-domain-policy SYSTEM "http://www.macromedia.com/xml/dtds/cross-domain-policy.dtd"><cross-domain-policy> <site-control permitted-cross-domain-policies="all"/> <allow-access-from domain="*" to-ports="5222,5223,7070,7443" secure="true"/></cross-domain-policy>
E) I copied this file into the conf folder in Openfire also (do not have any idea if this is needed here or if this step is right and step D is wrong):
i) C:\Program Files (x86)\Openfire\conf\crossdomain.xml
04. After you have done all of this, you need to open up some ports on your router.
A) Every router is different but you need to log in to your router (normally at http://192.168.1.1)
B) You need to port forward to your computer's local IP address (something like 192.168.1.101):
i) 80, 3478, 5222, 7070, 9090, 40000-45000 (I use these for Jingle nodes/Media proxy/Jitsi-videobridge, but they are not needed)
05. Restart both Openfire and XAMPP.
06. After you have done all this converse is the final step.
A) In your htdocs or equivalent folder you need the converse's index.html and the build, css, and component folder's at a bare minimum (copy the entire contents if need be).
B) Navigate to the index file in your browser. Since I put mine in a folder called "converse" I would use: http://127.0.0.1/converse
i) This will get you started. If you are making your own page....
C) Add this in the head of a html document:
<script src="builds/converse.js"></script><link type="text/css" rel="stylesheet" media="screen" href="css/converse.min.css" /><script type="text/javascript" src="analytics.js"></script>
D) And add this after the </body> tag but before the </html> tag:
i) Where bosh_service_url is the name of your IP address or FreeDNS name ( ie. http://127.0.0.1:7070/http-bind/ )
ii) Play with the converse.initialize options to match what settings you would like to have. Read more about converse.js configuration variables here.
<script> require(['converse'], function (converse) { converse.initialize({ bosh_service_url: 'http://example.com:7070/http-bind/', // 'https://conversejs.org/http-bind/' // Please use this connection manager only for testing purposes i18n: locales['en'], // Refer to ./locale/locales.js to see which locales are supported keepalive: true, message_carbons: true, play_sounds: true, roster_groups: true, show_controlbox_by_default: true, xhr_user_search: false, allow_muc: false, auto_reconnect: true, allow_registration: false, debug: false, use_otr_by_default: true, visible_toolbar_buttons: { call: false, clear: true, emoticons: true, toggle_participants: false } }); });</script>07. Debugging (the fun part):
***NOTE*** I worked on getting BOSH working for almost a day and a half before I found the right condition to make it work.
***Remember*** It is the struggle that brings such pain and torment to all coders/admins alike, but those who do not experience this struggle will not reap the benfits of figuring it out and have it working. The joy you get when you experience this emotion is so satisfying.
***NOTE2*** Can't get something to work? Let me know! I will do my best to help you figure it out.
Q1. I can access my Openfire server from a local computer, but cannot from an external IP (outside of the office)
A1. Port forwarding is probably not configured properly. Use this little utility to see if the port is accessible to the outside world.
Q2. I can chat using a Jitsi, Pidgeon, etc. client, but cannot connect to my server using converse.
A2. Your BOSH server probably is not set up properly. Use this bosh_service_url to test that theory: https://conversejs.org/http-bind/
A2. If when using that url, you can log in to your server, the BOSH is not quite set up correctly. Go back over Steps 3 B i, 3 D, and 3 E.
A2. Still having problems? Let me help you! Contact me
08. I hope this helps someone out there.