Integrate IBM WebSphere Cast Iron Web API Services with Facebook

Integrating with the Facebook Graph API

This article shows API developers how to integrate IBM® WebSphere® Cast Iron® Live Web API Services with Facebook, so you can easily and rapidly create, socialize, and manage compelling Web APIs for Facebook. In this article, learn how to define an API, customize Developer pages for it, register an application, and test your API.

Vineet Gupta (vigupta6@in.ibm.com), Certified IT Specialist, IBM

author photo - vineet gupta 3Vineet Gupta is Certified IT Specialist skilled in IBM middleware products. He works in IBM Lab Services for WebSphere at India Software Labs, Gurgaon. He has 8 years of experience in developing solutions for multiple customers from various domain, including Distribution, Telecom, Healthcare, and Content management. He is also the author of a Support Pac on Enterprise exception patterns (MQ Support Pac ID08). He holds a Master of Computer Applications degree from Guru Jambheshwar University, Hisar.



26 June 2013

Also available in Russian Japanese Portuguese

Introduction

Try Cast Iron Live Web API Services

Sign up for a free, 90-day cloud-hosted trial of Cast Iron Live Web API Services.

Web APIs are your enterprise's external persona, enabling you to connect easily with partners and allowing other companies to build businesses on top of yours. IBM WebSphere Cast Iron Web API Services provides a complete set of web API capabilities that help you attract partners and innovative application developers, both internally and externally:

  • Web APIs allow rapid creation of new APIs from existing business assets or cloud services through configuration.
  • The Cast Iron Web API Services provide capabilities for web API assembly, securing and scaling web APIs, analytics for business operations, and a developer portal to socialize the APIs.

This article gives step-by-step guidance on how to integrate Cast Iron Live Web API Services with Facebook. The process consists of the following tasks:

  1. Create a simple proxy, which in turn will call the Facebook Graph API.
  2. Return the feed from Facebook as a JavaScript Object Notation (JSON) response.
  3. Show Twitter and Facebook feeds on developer pages.

Prerequisites

This article is intended for API developers and shows how to develop an API in Cast Iron Web API Live Instance. Prior knowledge of the following skills will make the examples easier to understand:

  • Fundamental concepts of JSON and XML
  • Fundamental concepts of Representational State Transfer (REST)
  • Creating a Cast Iron Web API administration login ID
  • Using the Facebook Graph API

To implement the example in this article, you need:

  • A workstation with a standard Internet browser
  • A valid Cast Iron Web API administrative ID and credentials
  • An Internet connection
  • A Facebook account
  • A Facebook page ID
  • An email account with which to register an application

The Facebook Graph API

The core of Facebook is its social graph of people and the connections they have to everything they care about. The Graph API presents a simple, consistent view of this social graph representing objects in the graph and connections between them. Every object in the social graph has a unique ID.

The Graph API uses this unique ID to access properties and connections (relationships) of the object. All the responses are JSON objects, as shown in Listing 1.

Listing 1. Graph API JSON responses
{
   "name": "Facebook Platform",
   "website": "http://developers.facebook.com",
   "username": "platform",
   "founded": "May 2007",
   "company_overview": "Facebook Platform enables anyone to build...",
   "mission": "To make the web more open and social.",
   "products": "Facebook Application Programming Interface (API)...",
   "likes": 449921,
   "id": 19292868552,
   "category": "Technology"
}

The Graph API allows easy access to public profiles of objects, but for additional information, you must get a user's permission. The Graph API uses open-standard OAuth 2.0 for authorization. Users can also authorize you to perform some tasks on Facebook, such as access friends and friends' likes. When a user authorizes an application, that application gets an access_token to see his or her feed, post shares, and so on. This access token should accompany every request to the Facebook Graph API to access the user's profile and other information.


Authentication for accessing the Facebook object profile

The first step in integrating with the Facebook Graph API is using authentication to access the Facebook object profile. This article uses the JKHLE mobile application, which will authenticate itself with Facebook using an OAuth 2.0 URL:

https://graph.facebook.com/oauth/access_token?
   grant_type=client_credentials&client_id=[mobile/facebook app 
   id]&client_secret=[mobile/facebook app secret key]

As a response to this URL, the mobile application receives an access token that it can use to get the object's profile (in our case, the Cast Iron developer). The mobile application uses this access token to send GET requests to retrieve the feed for the user (the Cast Iron developer).


Define a simple proxy to get a user's feed

To create and define a proxy to access a user's feed, complete the following steps:

  1. Log in at https://webapi.castiron.com/webapibuilder using the administrative credentials that you received by email when you registered (see Figure 1).
    Figure 1. Sign in to Cast Iron Web API Services
    Image showing how to sign into Cast Iron Web API Services
  2. Create an API either by clicking the Create link on the Getting Started with Web API page, or by clicking APIs on the title bar. Figure 2 shows both options.
    Figure 2. Creating an API
    Image showing how to start creating an API
  3. On the Define APIs and Resources page, populate the following fields, then click Create to create your API definition (see Figure 3):
    • In API name, type Facebook.
    • In context, type Facebook.
    • In API description, type To connect to Facebook for Cast Iron developer.
    Figure 3. Defining your API
    Image showing how to define your API

Define API resources

The next step is to define your API's resources. To create and configure a resource, open the Baggage API in Edit mode. You can edit the Baggage API in either of two ways: by clicking the Pencil icon or by clicking Facebook itself. See Figure 4.

Figure 4. Defining resources for your API
Image showing how to define resources for your API

On the Resource Definition tab, define resources with appropriate values. Use the following values to define a status resource for the Baggage API:

  • In the Resource name field, type Feed?access_token=myaccesstoken.
  • In the Description field, type To get Feed of Cast Iron Developer.

Then, click Add to define the resource. See Figure 5.

Figure 5. Adding a status resources for your API
Image showing how to add a status resources for your API

Configure the end point

Now that you have defined the Feed resource, you must configure the end point, expected response, and other parameters. You can do so by clicking either the Pencil icon in front of the resource or the resource name (Feed, in this case).

On the next page, you define all the details related to resources, including parameters, request headers, response headers, the request body, and the response body.

Note: Remember, you define the new and selective interface based on the existing back-end resource in the Response Body field.

For this article, all the requests coming into this resource will be forwarded to the Graph API URL (https://graph.facebook.com/castirondev/feed). As a result, define your resource as shown in Figure 6.

Figure 6. Define your resource
Image showing how to define your resource

When you save your API, a proxy will be defined to connect to Facebook.

Activate your API

To activate your API, define an entitlement with following values:

  • In the Name the Entitlement field, type Basic.
  • In the Describe the Access Level field, type This is Basic entitlement.
  • In the Calls / Minute field, type 10.
  • Select the Requires Approval check box.

    Checking this box allows access by ID alone; no secret key is required.

See Figure 7.

Figure 7. Define an entitlement
Image showing how to define an entitlement

Note: If you do not define an entitlement, your resource will not be activated.

Now, click the Resource Definition tab. Then, click Activate against the resource, as shown in Figure 8.

Figure 8. Activate your resource
Image showing how to activate your resource

Your API has been successfully activated.


Customize your developer pages

Developer pages provide a way to socialize APIs to customers, partners, and developers and gain adoption. On these pages, you can configure the Facebook feed and Twitter IDs for your Developer portal. You can access Developer pages by clicking Socialize on the Getting Started with Web API page or by choosing Customize Developer Pages from the list below your user name (see Figure 9).

Figure 9. Accessing the Developer pages
Image showing how to access the Developer pages

For this article, you can use any icons you like as logos for your Developer pages. However, you must define the properties shown in Figure 10.

Figure 10. Defining properties for your Developer pages
Image showing how to define properties for your Developer pages

Note on the Developer portal

Please note that the feed from the IBM Software Services India Facebook wall is shown on the home page of the Developer pages. Please register on this page by clicking Sign Up to get access to the Developer API and register apps.

As explained earlier, users can get the feed from Facebook pages as RSS or atom10 using an ID. For this article, I configured the IBM Software Services Facebook feed in atom10 format as the RSS feed that appears on the Developer portal homepage using the following URL:

http://www.facebook.com/feeds/page.php?format=atom10&id=112906215424363

One click of Publish, and the Developer portal is published, as shown in Figure 11.

Figure 11. Your finished Developer portal
Image showing the finished Developer portal

Register an application to test your API

Use your credentials to log in to the Developer portal. If your login was successful, you will see your API's Getting Started page, shown in Figure 12.

Figure 12. The Getting Started page for your new API
Image showing the Getting Started page for your new API

Click Register Apps to navigate to the Register an Application page. Register an application using following values (see Figure 13):

  • In the Name field, type Baggage Tracker.
  • In the Description field, type Baggage Application.
  • In the URL field, type http://www.mybaggagetracker.com.
Figure 13. Registering an application for your new API
Image showing how to register an application for your new API

Click Add. The registration window shown in Figure 14 appears.

Figure 14. Registering the new application
Image showing how to register your new application

Note: Be sure to remember your application ID and secret key so that you can call your API from applications.

Click Register. As Figure 15 shows, the application will be registered with Cast Iron Web API Live Instance.

Figure 15. Your newly registered application
Image showing your newly registered application

If you want your application to be featured on Developer portal app pages, select the Allow this app to be featured check box.


Testing the Feed API

At this point, you have defined an API, customized Developer pages for it, and registered an application. Now, you're ready to test the API.

To test your new API, open any browser, and enter the following URL:

https://guptavineet.web.castiron.com/Facebook/Feed?
   access_token=[accesstoken]&appId=[application Id]

You will get the Facebook feed as JSON, as shown in Figure 16.

Figure 16. Your new Facebook feed
Image showing your new Facebook feed

Conclusion

Now you know how to develop APIs that can connect to Facebook. Try creating a POST method API as a proxy to https://graph.facebook.com/castirondev/feed with the parameters access_token and message to post updates on the Facebook wall. Good luck!

Resources

Learn

Get products and technologies

Discuss

Comments

developerWorks: Sign in

Required fields are indicated with an asterisk (*).


Need an IBM ID?
Forgot your IBM ID?


Forgot your password?
Change your password

By clicking Submit, you agree to the developerWorks terms of use.

 


The first time you sign into developerWorks, a profile is created for you. Information in your profile (your name, country/region, and company name) is displayed to the public and will accompany any content you post, unless you opt to hide your company name. You may update your IBM account at any time.

All information submitted is secure.

Choose your display name



The first time you sign in to developerWorks, a profile is created for you, so you need to choose a display name. Your display name accompanies the content you post on developerWorks.

Please choose a display name between 3-31 characters. Your display name must be unique in the developerWorks community and should not be your email address for privacy reasons.

Required fields are indicated with an asterisk (*).

(Must be between 3 – 31 characters.)

By clicking Submit, you agree to the developerWorks terms of use.

 


All information submitted is secure.

Dig deeper into Mobile development on developerWorks


  • Bluemix Developers Community

    Get samples, articles, product docs, and community resources to help build, deploy, and manage your cloud apps.

  • Mobile weekly

    Innovations in tools and technologies for mobile development.

  • DevOps Services

    Software development in the cloud. Register today to create a project.

  • IBM evaluation software

    Evaluate IBM software and solutions, and transform challenges into opportunities.

static.content.url=http://www.ibm.com/developerworks/js/artrating/
SITE_ID=1
Zone=Mobile development, Cloud computing, WebSphere
ArticleID=934484
ArticleTitle=Integrate IBM WebSphere Cast Iron Web API Services with Facebook
publish-date=06262013