Facebook’s new request dialogs

Facebook has pushed a very nice feature out recently: the new javascript request dialogs. These dialogs are poised to replace the old fbml friend selector, and there is even talk of porting these to a mobile interface. What is really great about these is that they no longer use bucket totals/allocations in determining how many friend’s a user can invite to the app. This is very welcome news considering the drop in prominence of stream stories since December 2010.

The new request API also opens up new and interesting ways of handling a user’s requests once they get to your application. Using a gift application as an example, let’s see how we can loop through a user’s outstanding requests and prompt them to share each gift. After they see the gift, we delete the request from their inbox.

1. The request form dialog javascript. This is invoked whenever a user wants to send a gift:
function showInvite(gift,giftname)
{
    //Pass in the gift id (gift), as well as the gift name (giftname).    
    FB.ui({
        method: "apprequests",
        message: "You have a gift!    Click accept to see what it is!",
        data: gift, //This will be passed back to you when a user accepts the request
        title: "Send "+giftname+" to 50 friends!"
    },
    function(response) {
        if (response && response.request_ids) {
            alert('Your gift has been sent!');
        } else {
            alert('You must select some friends to send gifts to!');
        }
    });
}

2. When the recipient accept’s their request, we are passed the request_ids parameter, which we can then use to query the graph API to find out who sent it, as well as pick up our gift id that was sent via the data parameter. To process only the gift accepted:

if(isset($_REQUEST['request_ids'])) {
    $request_ids = $_REQUEST['request_ids'];
    $request_data = $facebook->api('/me/apprequests/?request_ids='.$request_ids);

    $from_name = $request_data['from']['name'];
    $gift_id_sent = $request_data['data'];

    //Prompt user to do something w/ received gift
}

Where the returned object looks like:

If we want to process all the outstanding requests, we just do not specify a specific request_id. This let’s us process all of a user’s requests at once:

    $request_data = $facebook->api('/me/apprequests/');

    $all_requests = array();
    if($request_data) {
        foreach($request_data as $key => $data) {
            //Store all of our requests, and then we can loop through them, displaying a prompt for each one
            $all_requests[$data['id']] = array($data['from']['name'], $data['data']);
        }
    }

3. Finally, we need to delete the requests we processed, as the new requests are not automatically deleted when a user accepts them:

$token_url = "https://graph.facebook.com/oauth/access_token?" .
         "client_id=" . $appid .
         "&client_secret=" . $app_secret .
         "&grant_type=client_credentials";

$access_token = file_get_contents($token_url);

//Delete a request.    
$request_url ="https://graph.facebook.com/" .
                $reqid .
                "?" .
                $access_token;

$requests = file_get_contents($request_url);

//print_r($requests);

$delete_url = $request_url . "&method=delete";

$result = file_get_contents($delete_url);
//echo("Requests deleted?" . $result);

That’s it! Very easy to use. One other thing…If you do not want to use the dialog (maybe your app is still FBML?), you can redirect the users to a full page request form by sending them to a full screen request page:

            $app_id = YOUR_APP_ID;

                 $canvas_page = YOUR_CANVAS_PAGE_URL;

                 $message = "Would you like to join me in this great app?";

                 $requests_url = "http://www.facebook.com/dialog/apprequests?app_id="
                                . $app_id . "&redirect_uri=" . urlencode($canvas_page)
                                . "&message=" . $message;

                 if (empty($_REQUEST["request_ids"])) {
                        echo("<script> top.location.href='" . $requests_url . "'</script>");
                 } else {
                        echo "Request Ids: ";
                        print_r($_REQUEST["request_ids"]);
                 }

If a user sends any requests, a request_ids POST variable will be sent to the redirect_uri. If you want to pass along your own data this way, be advised that appending multiple GET variables will not work. I have not found a good way around that yet, but I did find that you could pass a single variable like: my_redirct_uri.php?myvar=myval.