Write your First mesibo Enabled Application - Javascript

Estimated reading time: 4 minutes

In this part, we will create a simple real-time app for the Web (Javascript).

Prerequisites

You MUST go through the following prerequisites before you read further.

  • Read the First App Guide.
  • Knowledge of Javascript

First Web (Javascript) App

Now let’s quickly start coding:

Add mesibo API for javascript in your code:

<script type="text/javascript" src="https://api.mesibo.com/mesibo.js"></script>

Initializing Mesibo

Before you send and receive real-time messages and calls, you need to initialize Mesibo. The initialization involves the following steps:

  1. Set your user credentials for authentication: access token using setCredentials and app ID using setAppName
  2. Set up Mesibo to invoke your listener class using setListener
  3. Set up database to store sent and received messages using setDatabase (Optional)
  4. Start Mesibo

Now, initialize mesibo like shown below

var demo_user_token = 'xxxxxxxxxxxxxxxxxxxx';
/* App ID used to create a user token. */
var demo_appid = 'web';

var api = new Mesibo();

api.setListener(new MesiboListener());
api.setAppName(demo_app_id);
api.setCredentials(demo_user_token);
api.setDatabase("mesibo");

api.start();

Implement MesiboListener to receive messages and status in real-time.

function MesiboListener() {
}

MesiboListener.prototype.Mesibo_OnConnectionStatus = function(status, value) {
	console.log("TestNotify.prototype.Mesibo_OnConnectionStatus: "  + status);
}

MesiboListener.prototype.Mesibo_OnMessageStatus = function(m) {
	console.log("TestNotify.prototype.Mesibo_OnMessageStatus: from "  
			+ m.peer + " status: " + m.status);
}

MesiboListener.prototype.Mesibo_OnMessage = function(m, data) {
	console.log("TestNotify.prototype.Mesibo_OnMessage: from "  + m.peer);
}

That’s it - you are now ready to receive your first real-time message.

Testing your first application

  1. Compile and Run Application.
  2. Mesibo_onConnectionStatus should cycle through various status information. Finally, you should receive status=1 which indicates that your app is successfully connected to the mesibo real-time server and ready to send and receive real-time messages.
  3. Since we do not have any other users right now, we will use mesibo console to send a test message. In a later section, we will learn how to send messages from the app itself.
    • Go to Console ->Application->Users. You should see the user you have created.
    • Go to user details by clicking the Edit button. Scroll down, you will see a section to Message User
    • Enter 1000 (or anything) in the From field, check Create This User checkbox, type message and click on Send.
  4. You will instantly receive this message in your mobile app in Mesibo_onMessage listener.

Sending Messages

In the previous section, we have used mesibo console to send a message. Now we will quickly learn how to send messages from the app itself. To send messages, we will use sendMessage real-time API for which we will need destination user, message-id, and the message itself.

Invoke the following function anywhere from your code to send a text message. In a later section, we will learn how to send rich messages.

function sendTextMessage(to, message) {
	var p = {};
       	p.peer = to;
	p.flag = MESIBO_FLAG_DEFAULT;
	var id = parseInt(Math.random()*10000);
	api.sendMessage(p, id, message);
}

That’s it! Try it out by creating two instances of the app and send messages to each other by using the above function.

Download Sample Application

You can download the following sample applications to learn more:

First Mesibo Application - C/C++ >>

mesibo, android, ios