automatic notification in database change :similar with facebook friend request

Question

i wish to develeop a php mysql based social networking site. Registered users will have the option to add another user as a friend just as is done in Facebook.

If user A clicks on the 'add friend' link on user B's profile, friend-request records will be made in A's and B's databases accordingly. When B visits the waiting friend-requests- showing-page ( as such the profile page), the request will be shown querying B's db.This much is pretty simple to do i think.

But while B is online, C can make a friend-request to B. I want to make a notification to B that C has made such a request even if B does not refresh his/her profile page(or any page with the option of showing the waiting friend-requests ). As to the type of notification, it can be a box showing the total number of friend-requests waiting. Clicking on the box will show the details. Or it could be in any other form.

My point of interest is how to make B aware of a new friend request while B is online without making him/her refresh the page containing the friend-requests?

Solution 1

To finalize the answers, I assume that you understand the database/notification DATA logic well, and now you are concerned only about HOW TO deliver it to the browser. I will list all the points here.

1. HTTP is a PULL protocol. You cannot push data from Server to Client.
2. So, what you can do is - continuously poll the server for new notifications.

You can do two types of polling :-

1. Short-polling - You send an Ajax request to the server for new notifications.
   • This is a short request, but you do it continuously in an interval (say 10s)
   • The server process the PHP and immediately returns.
   • You process the returned data (eg. Show notifications)
2. Long-polling - You send the same request as above. BUT...
   • In this, the requested PHP file goes into an infinite loop, checking DB continuously.
   • When a DB change is there, the PHP file "echo" it and ends the loop. Now the request is completed, and data is received at Browser.
   • You process the data.
   • Start another long-poll Ajax request, and the steps repeat again.
   • (Extra: If the PHP is not completed in a particular timeout, then abort the current request and start new one.)

Next, you can implement any of these in two different ways:-

1. Write your own Javascript code - Needs some expertise, but you can learn it!
2. Use some libraries - Easy, and time-saving. You can use PubNet, BeaconPush etc.

I hope that this makes a clear idea to you!

Solution 2

you need to write javascript that sends request to server after each interval of time. and then on the server side you can query the database and respond to the client if there are any new friend requests.

use the javascript setinterval function

var refreshId = setInterval(function(){  
$.ajax({
type: "POST",
url: "request.php",
data: 'more_updates='+more_updates, // or any data you want to send
cache: false,
success: function(html){
$('.old_updates').prepend(html).fadeIn('fast'); // response from server side process
}
});
}

},10000);

here we are sending data every ten seconds. so on the server side if we have any new friend request pending that are new or not confirmed it updates the client side.

Solution 3

First, you don't need to keep separate databases/tables for each people. You can keep a single database table with the following columns:

table_friendship

+------+---------------+-------------+------------+
|  id  |  friend_from  |  friend_to  |  approved  |
+------+---------------+-------------+------------+
|  1   |      A        |      B      |     NO     |
+------+---------------+-------------+------------+
|  2   |      C        |      B      |     NO     |
+------+---------------+-------------+------------+

Here in this table, the entry 1 means, A requests B for friendship, and NOT approved. Entry 2 means, C requests B for friendship, and NOT approved yet.

Next step, is to notify "B" that two requests have been arrived at the server. Sadly, the server cannot send messages to the client (Browser). So what we are doing is, continuously poll the server through AJAX request. The request works like any other page request, but the difference is, you can request a PHP page without reloading the browser.

You can request the page friend_requests.php in an interval of 10 seconds. The page should do the following:

1. Do the SQL "SELECT COUNT(*) FROM table_friendship WHERE friend_to = B AND approved = "NO" (Just a pseudo-SQL only!)
2. Return the following data: Number of requests pending, and New requests etc.

At the Browser side, you can display this data in the "BOX" that you have specified.

When you approve the request, you again send the AJAX request to another PHP page, to change the approved column to "YES"

More on Ajax - en.wikipedia.org/wiki/Ajax_(programming)

Solution 4

I think you are searching for a push notification service.

You can either implement your own (using Comet), or subscribe to a public service.

Examples:

PubNub, BeaconPush

You will find a lot more with google.

Edit

I think my answer was not clear enough. With my suggestion, you could do this (using pubnub):

User B (user ID 7) writes a friend request to user A (user ID 8). In your PHP handler you do:

$pubnub->publish(array(
    'channel' => 'friend_requests_8',
    'message' => array( 'request_from' => '7' )
));

I'm not very used to php, but I hope you understand what I mean.

On the Client page you can just register to your channel ('friend_request_') and then handle the requests:

// PUBNUB.subscribe() - LISTEN
PUBNUB.subscribe({
    channel  : "friend_request_<? echo $user_ID; ?>",
    callback : function(message) { alert('FRIEND REQUEST FROM USER ID: ' + message.request_from) }
})

So with this solution you will not have to handle any timings or loops, because pubnub handles this for you. Facebook does this (as far as I know) and BeaconPush is used by EA for the Battlelog, which, in my opinion, is a great website with a lot of interessting web techniques.

View more solutions

Comments

[Istiaque Ahmed]

hmm, so the search with ajax into db will go on within a never-ending loop provided the user does not close the page?

[Istiaque Ahmed]

Any comment on p0wl's answer? which one do u think to be better?

[Istiaque Ahmed]

Should ur recommendation be better than what Vishnu Haridas suggested?

[Istiaque Ahmed]

as to push notification, my idea is- this is based on javascript. am i right? do u think there is any such best script to use for the mentioned task taking in consideration the issues of easiness-to-learn, performance etc/

[p0wl]

The sending of the push notification is done at your packend (php) but the listening should be in javascript, because this is the only method that avoids timers (which would be javscript as well) and does not require a page refresh.

[Vishnu Haridas]

The PubNub helps you to implement Ajax calls and timers easily, in simple 2 steps as p0wl explained. Either way you are polling the server. Because HTTP is a pull-protocol, you can only pull the data from the server, you cannot push the data from the server to the Browser.

[Vishnu Haridas]

As these techniques are well explained, now it's upto you to choose from the various techniques. You can either choose to write your own Ajax calls, or you can use the PubNub library.

[Istiaque Ahmed]

as pub nub is not fully free, i prefer beaconpush. Can u please provide me a single example for the situation stated in my post i.e. for a logged in user, an ajax call (preferably through jquery) will be continuously checking for any change in the db. on finding any such change, it will send back a notification ( json ?) to the page viewer.

[Istiaque Ahmed]

will it be better than what p0wl suggested? reasons pz

[p0wl]

you did not understand the technique I suggested. there will be no continous check if you use push notifications. you will just send a notification to the user that should see the friend request using the message channels. I suppose reading a few tutorials and playing around (maybe with jsfiddle.net). if you are able to write a facebook like website, you will be able to create small exampels of push notifications...

[Deept Raghav]

the answer what @p0wl gave was through a push notification service... iam advising you to write your own code in php from scratch ( handles the request )... and request sending through jquery ajax

[Istiaque Ahmed]

I understand. But i need to know about performance comparison. any idea?

[Istiaque Ahmed]

so PubNub does not push any data from server to browser? then how is it a push service?

[Vishnu Haridas]

Actually you cannot push data from the Server to Browser. PubNub helps you to implement through some codes, to make you feel like you are "Pushing" data from Server to client. That will help you to think that you are really pushing data from Server to client. In the background, "Pulling" is going on, which we don't need to bother. You can understand the various Push-mechanisms in this article - en.wikipedia.org/wiki/Comet_(programming). I recommend that you use PubNub if you are getting too much confused about all these HTTP concepts.

[Vishnu Haridas]

I examined the Facebook website using the "firebug" tool in FireFox, and discovered that Facebook is using "XMLHttpRequest long polling" technique (see the above said Wikipedia Article) to deliver the notifications. I think this is sufficient to you, and if you like, I can write in detail as another answer.

[Vishnu Haridas]

@IstiaqueAhmed In all the methods you are using the same techniques - Ajax calls and Polling. So, the performance depends on how you implement it - If you are using a heavy-size library, then your coding will be easy, but will take more resources to execute. If you are writing your own abstract code (as Raghav Bhushan suggested), you will get good performance in less code, and you can tweak your code well in a later time.

[Vishnu Haridas]

@p0wl You missed the real point - At the programmer's view, there is no long requests, as you said it. But, in the background, this Push service is actually implemented using long-polling Ajax calls only.