Blog

Home/Blog

How to: Use the Facebook Graph API in your Windows Phone 8 app

Facebook logo

Facebook logo

I’ve recently been playing around with Windows Azure properly in my Windows Phone applications using authentication to login to the app and access my Azure service. While that’s cool and all, what’s cooler is being able to fully access the Facebook Graph API from your device using your Windows Azure service! While most of the basic requests to the Graph API are capable with a simple call, some however are not and need an access token which isn’t provided by the Windows Azure service when your account is authenticated.

There is a simple step to get your access token for your logged in account and then you can use all the available features such as posting on walls, uploading picture and many more! The steps are as follows:

  1. Login to your Windows Azure account and navigate to the mobile service for your application. From there click Data.
  2. At the bottom of the page, click Create.
  3. Give the name of the table Identities for example, and set the permissions to Only Authenticated Users.
  4. Click on your newly created table, and go to Script.
  5. From the drop down menu, select Insert.

You now want to paste in the following code:

function insert(item, user, request) {
    item.UserName = "";
    var identities = user.getIdentities();
    var req = require('request');

    if(identities.facebook)
    {
        var fbAccessToken = identities.facebook.accessToken;
        var url = 'https://graph.facebook.com/me?access_token=' + fbAccessToken;

        req(url, function(err, resp, body){
            if(err||resp.statusCode !== 200) {
                console.error('Error sending data to FB Graph API: ', err);

                request.respond(statusCodes.INTERNAL_SERVER_ERROR, body);
            } else{
                try{
                    var userData = JSON.parse(body);
                    item.UserName = userData.name;
                    request.execute();
                } catch(ex){
                    console.error('Error parsing response from FB Graph API: ', ex);
                    request.respond(statusCodes.INTERNAL_SERVER_ERROR, ex);
                }
            }
        });
    } else
    {
        request.execute();
    }
}

Now change the drop down to Read and paste in the following.

function read(query, user, request) {

    var result = {
        id: query.id,
        identities: user.getIdentities()
    };

    if(query.id){
        request.respond (200, result);
    } else{
        request.respond(200, [result]);
    }
}

As you can see here, when the user tries to get data from the table, it will return the result from a query based on an id (the facebook user’s id). This makes it possible for you to now get the access token in your Windows Phone application with a very simple method call.

To do this, just add the following into your class you are using to get access to the Facebook API (in my application, I have created a separate class to work with the Facebook API):

        public static async Task GetAccessToken()
        {
            var table = App.MobileService.GetTable("Identities");
            var response = await table.ReadAsync(App.MobileService.CurrentUser.UserId);
            var identities = response.ToArray();

            var json = ((JObject)JsonConvert.DeserializeObject(identities[0].ToString()))["identities"]["facebook"];

            return json["accessToken"].ToString();
        }

You now have your access token and can play with the Facebook Graph API in your Windows Phone application! You will need to set up permissions in your Facebook application which the user will have to register to use to do certain tasks with the app, for example posting a status. If you need help using the Facebook Graph API with your Windows Phone app, just let me know and I will try my best to help.

I have also been told that there is a Facebook for .NET library which is capable of working with Windows Azure, however I like a challenge and am attempting it my way!

3 Responses to “How to: Use the Facebook Graph API in your Windows Phone 8 app”

By James Alexander - 29 August 2013 Reply

How did you get the actual accessToken from FB? It looks like you already had it stored in the Identities table.

By James Croft - 29 August 2013 Reply

As you can see from the scripts, this is only the insert option. I’ve included it to show how you will store your token in the table. If you look at the read function, you will notice a JSON object being created and the identities token returns the specific Facebook access token for you to use on the Graph API.

[…] /* 0) { ratingctl00_cphMiddle_cphContent_tr3w45fwwvre_itemRating = result['Rating']; SetCurrentRating(‘ctl00_cphMiddle_cphContent_tr3w45fwwvre_itemRating_pnlHolder’, result['Rating'], “disabled fullStar”, “disabled emptyStar”, true); if(votesCountctl00_cphMiddle_cphContent_tr3w45fwwvre_itemRating!=null) { votesCountctl00_cphMiddle_cphContent_tr3w45fwwvre_itemRating ++; SetVotesCount(‘ctl00_cphMiddle_cphContent_tr3w45fwwvre_itemRating_lblUsersRated’, ‘(‘ + votesCountctl00_cphMiddle_cphContent_tr3w45fwwvre_itemRating + ‘ votes)’); } SetRatingCookie(‘r’, ‘i34358′, ‘1’); } else if (result['Status'] == 1) { alert(‘The session has expired. Please refresh the page to be able to vote!’); } } /* ]]> */ (0 votes) 0 comments   /   posted by Silverlight Show on Aug 28, 2013 Tags:   windows-phone , facebook , james-croft Read original post at James Croft’s Blog […]

Comment on this post: