Before starting I assume that you must have the below
configuration in your machine.
1.
PHP 5.2 or higher
2.
Apache
3.
MySQL
Also before proceeding further I assume that you must have
basic jQuery and php knowledge.
XMPP server can be installed by using Openfire. Openfire is
written in JAVA. Below are the steps by which you can install openfire in your
machine
Step1. You have created
a MySQL database for openfire users and configuration. If you are using
phpMyAdmin then please see the below instructions
1.
In the home page of phpmyAdmin select Privileges
2.
Then click on “Add a new user”
3.
For making it more simple please give user
details as user name = openfire, host=localhost(or 127.0.0.1) and select radio button as “Create database with same
name and grant all privileges” . So now
you have a database as openfire please ensure this.
Step2. Now it’s
time to install openfire. For downloading it you can visit the site http://www.igniterealtime.org/downloads/index.jsp
. Run it and after installation
completion launch the server. Here you
must see the server status window where you can find “Launch Admin” option.
Just click it to enter into the web based configuration section of openfire.
Step3. In the configuration
section you will find database settings. Where it will ask you select embedded
database or a standard database connection. Choose a standard database
connection so that you can use your MySQL database. Select MySQL from the
Database Driver list. Insert the name of your server and database into the
Database URL field. For example, for a MySQL database named openfire set up on
localhost, you'd enter:
jdbc:mysql://localhost:3306/openfire
Then enter the username and password for the database user
you created earlier.
Step4. So till
now you have created admin username and password and other settings. Now to
test please login with admin username and password. One important point here is
to check your server name as it will be required to construct your JID which
will be required later. So if the username is “john " and server name is “desktop” and
password is “openfire” then you can
connect like below connection.connect("john@desktop", "openfire",
onConnect); I will discuss this later in
detail . There are still many other options to select but here we are
discussing about basic programming with XMPP using JQUERY.
Step5. Now it’s
time to configure your apache using BOSH so that we can bind HTTP with XMPP so
please do the below things in your http.conf apache configuration file
LoadModule proxy_http_module modules/mod_proxy_http.so
LoadModule proxy_module modules/mod_proxy.so
Then at the very bottom of the configuration file please add
# XMPP proxy rule
ProxyRequests Off
ProxyPass /bosh http://127.0.0.1:7070/http-bind/
ProxyPassReverse /bosh http://127.0.0.1:7070/http-bind/
(Note use 127.0.0.1 or localhost as per your server configuration)
So now your BOSH URL is
http://localhost/bosh
Step5. Now we
start some basic programming with xmpp using jquery and php(Note php may not be
required but here I have used a php page).
So for example create a page called xmppconn.php and include below js
files
<script src="scripts/jquery.js"></script>
<script src="scripts/jquery-ui.js"></script>
<script src="scripts/swfobject.js"></script>
<script
src="scripts/strophe/strophe.js"></script>(download these
files)
<script
src="scripts/flXHR.js"></script>(download these files)
<script
src="scripts/strophe/plugins/strophe.flxhr.js"></script>(download
these files)
Let’s say two users John and David are in conversation and
John is sending messages and receiving messages from David so John becomes here
sender and David receiver.
So for connecting to
xmpp use the below JS code
var conn = new Strophe.Connection(‘http://localhost/bosh’);
Note how I have used the BOSH url
var jid =” john@desktop”; Note how I have used desktop in my
case it is my server name
var pwd = 'openfire';
conn.connect(jid, pwd, function (status) {
if
(status === Strophe.Status.CONNECTED) {
$(document).trigger('connected');
}
else if (status === Strophe.Status.DISCONNECTED) {
$(document).trigger('disconnected');
}
});
So now to receive continue
message and to connect xmpp please use the below code
var xmppconn = {
connection: null,
handle_message: function (message) {
var full_jid = $(message).attr('from');
//alert(full_jid);
var uname =
Strophe.getNodeFromJid(full_jid);
var body1 = $(message).find('body');
if
(body1.length > 0) {
body1
= body1.text();
}
else {
body1
= null;
}
var div = $("<div></div>");
body1 = uname+': '+body1;
div.append(body1);
div.prependTo('#chatarea');// showing messages in div
return true;
}
};
var conn = new Strophe.Connection(‘http://localhost/bosh’);
Note how I have used the BOSH url
var jid =” john@desktop”; Note how I have used desktop in my
case it is my server name
var pwd = 'openfire';
conn.connect(jid, pwd, function (status) {
if
(status === Strophe.Status.CONNECTED) {
$(document).trigger('connected');
}
else if (status === Strophe.Status.DISCONNECTED) {
$(document).trigger('disconnected');
}
xmppconn.connection = conn;
});
$(document).bind('connected', function () {
xmppconn.connection.addHandler(xmppconn.handle_message,
null, "message", "chat");
xmppconn.connection.send($pres());
});
Now to send message
to anybody use the below js code
var msg = $msg({to: sendjid, type: 'chat'}).c('body').t(text);
conn.send(msg);//This is the connection object
If you have any suggestion then please put your comments .
