How To Build Facebook Application Using Google App Engine:

You need following:

  • A facebook account.
  • A Google account.
  • The Eclipse IDE with the GAE plug-in has installed.
  • You need 'restfb-1.6.11.jar',Get it from here.

The first step is to register your application on both Face book and GAE. It's a good way to create the application on both platforms at the same time to ensure that the information you enter matches up as needed.You need to create a new app in your facebook, Way of creating new app in facebook

Open https://developers.facebook.com

You will get following window

Fig : 1

Facebook app engine Login

If you are creating facebook app first time you need to register in Facebook Developers site

To register in Facebook Developers site follow the screen shots :

Fig 2 :

Entering details in Facebook Login Page

You will get following window when you hit on login button

Fig 3:

Facebook app Register page

After click on Register Now the following window will appear

Fig 4 :

Facebook Account Verify

This is the important step because your are developing your own facebook app, so for security reasons you need to verify your account

After hit on verify your account the following window will appear

Fig 5 :

Enter phone to verigy your account

If you not added any number of you in your facebook account when you creating your facebook account don’t worry be cool it’s so simple see following:

Fig 6:

Add your number

When you click add

Fig 7:

Select type of your mobile

Fig 8 :

Enter your conformation code

Finally you will get following page when you successfully added your number and logged—in

Fig 9:

Click here to create new app

Fig 10 :

Enter your app name

Fig 11 :

Enter captcha words for security

Fig 12 :

Enter your app details

Hold on here

Here the explanation about the above red marked fields

1 red mark field--> To fill the first red marked field you need to have Google Ape Engine account, following the way of creating Google app engine account.

Register the application with GAE

Open the link: https://appengine.google.com/ Sign in on the applications page on GAE— and click Create Application button the following window will appear.

Fig 13:

Enter your app title etc...

Click Create Application to complete the GAE registration process.

See the above fig there is a name called appoffacebook.appspot.com, this is what you have to fill in the 1st red mark field. See the above fig 12 for 1st red mark field.

2nd & 3rd red mark fields

To fill up the 2nd and 3rd red mark fields which are in fig 12, follow the fig.

Fig 14:

Select how your integrate with facebook

In the above fig site url is same name of app domain name including http.

How to develop application using Google App Engine?

Next thing you need to develop application using Google App Engine plugin in eclipse, to know how to develop Google App Engine Application creation in Eclipse..

To download source code of this project

See below there is a web.xml fig, the selected names one is from above fig and the second one is from web.xml which is in our application, those should be match because when we login to face book, facebook redirect the url to our application, by making use of that url it goes to appropriate class.

Fig 15:

Edit url pattern in web.xml

Add the following line to appengine-web.xml:

<ssl-enabled>true</ssl-enabled>

HOW TO RUN THE APPLICATION:

Deploy the project into Google App Engine, to know the Deployment process see below link.

Deploy project into Google App Engine

After deploying the application open https://appengine.google.com/ you will get following page

Fig 16:

My appllications

When you click on our app link , the following page will appear.

Fig 17:

click Application settings

Fig 18:

Next click on the application setting, you will get another window see below

click on application default version url

Click on Application Default Version URL :

You will get your project (application) index page which you write.

Fig 19:

click here to write my index page

This window will appear when you click on that link

Fig 20:

facebook login login page

Enter your username and password to get friends list form your account

After finishing login you will get the following window directly

Fig 21:

successfully logged into facebook

Here is the process how our application getting our friends list :

When you click the link which is displaying when our application runs (see the fig 19).

  • Our application sends the request to facebook login page with the app key id.
  • When we login to our facebook book, facebook send the response with the access token to our application (in our code(index.html) see there is a link with redirect_uri=“ “https://www.facebook.com/dialog/oauth?client_id=550398948320179&redirect_uri=http://appoffacebook.appspot.com /FriendsListServlet
    (this is url, when the response come from facebook )”). using that url it goes to our web.xml file and checks whether there is any url with name, and goes to specific servlet class.
  • The servlet class getting the friends list from our account. And displaying friends list in FriendsList.jsp.
HTML Comment Box is loading comments...