Hacking Social Networks APIs… the MovieIT way

Javascript based Facebook login OAuth 2.0

One of the positive features of OAuth 2.0 is that the OAuth dance occurs only by using HTTP GET method. This code resides in the Auth.htm page. The if structure checks the browser URL to identify the current step and move to the next one. The first step is to access the https://www.facebook.com/dialog/oauth by providing the application id, the redirection URI and the response type (which in our case is of type token). In our case we set the redirection address to again to the Auth.htm file. After the successful redirection from the Facebook page the script makes again a HTTP GET request to the same endpoint by providing the application ID, redirect URL, the response type and the resources that this application will have access to. If everything goes well then Facebook redirects the browser to back to the Auth.htm page by providing a code parameter. The final part of the script extracts this information for the url and passes it to our servlet in order to provide a customized to the user homepage (e.g. his profile image etc.).



01 var appId = "*********************";
02  var AppSecret = "****";
03  if (window.location.hash == "") {
04  if (window.location.search == 0) {
05  url = "https://www.facebook.com/dialog/oauth?client_id=" + appId + "&redirect_uri=" + 
06  window.location + "&response_type=token";
07  window.location = url;
08  } else {
09  var codeURL = window.location.search;
10  var codeURLSubString = codeURL.substring(6, codeURL.length);
11  var appAuth = "https://graph.facebook.com/oauth/access_token?client_id=" + 
12  appId + "&redirect_uri=" + "http://" +
13  window.location.host + window.location.pathname + "&client_secret=" + 
14  AppSecret + "&code=" + codeURLSubString;
15  window.location = "http://kanga-et2e10.ecs.soton.ac.uk:8080/Testing_servlets/Auth?oauth=" +
16  encodeURIComponent(appAuth);
17  }
18  } else {
19  if (window.location.hash.substring(1).indexOf("access_token") === 0) {
20  
21  graphUrl = "https://www.facebook.com/dialog/oauth?client_id=" + appId + "&redirect_uri=" + "http://" + 
22  window.location.host + window.location.pathname + 
23  "&scope=email,read_stream,publish_stream,user_checkins,"+
24  "friends_checkins,publish_checkins,offline_access,user_photos,"+
25  "user_birthday,user_online_presence,friends_online_presence";
26  window.location = graphUrl;
27  }
28  }
29  function displayUser(user) {
30  userName.innerText = user.name + " " + user.id;

31 }

Java2htm

Check in on Facebook

The following code snippet is a Java Servlet code that uses an HTTP GET method to access the https://graph.facebook.com/me/checkins endpoint. For the successful invocation we must provide a message, an access_token, the placeID of the place where the movie was watched, the friends ids they are also watching the movie and the coordinates of the check in place. Another important part on this code is the multipart/form-data mime type. This is the only content type supported by Facebook. Finally the DataOutputStream and the InputStream handles the HTTP request and response respectively.



01  String urlParameters="access_token="+access_token.replace("\n", "")+
02  "&"+"message="+"I saw the \""+mov.get("original_name")+"\" movie "+
03  mov.get("trailer")+"&place="+pid+"&tags="+
04  friendsStr+"&coordinates={\"latitude\":\" "+latitude+"\", \"longitude\": \""+longitude+"\"}";
05  //Create connection
06  url = new URL("https://graph.facebook.com/me/checkins");
07  connection = (HttpURLConnection)url.openConnection();
08  connection.setRequestMethod("POST");
09  connection.setRequestProperty("Content-Type","multipart/form-data");
10  connection.setRequestProperty("Content-Length", "" + 
11  Integer.toString(urlParameters.getBytes().length));
12  connection.setRequestProperty("Content-Language", "en-US"); 
13  connection.setUseCaches (false);
14  connection.setDoInput(true);
15  connection.setDoOutput(true);
16  
17  //Send request
18  DataOutputStream wr = new DataOutputStream (connection.getOutputStream ());
19  wr.writeBytes (urlParameters);
20  wr.flush ();
21  wr.close ();
22  
23  //Get Response 
24  InputStream is = connection.getInputStream();
25  BufferedReader rd = new BufferedReader(new InputStreamReader(is));
26  String line;
27  String responseCheckin=""; 
28  while((line = rd.readLine()) != null) {
29  responseCheckin+=line+ "\r";
30  }

31 rd.close();

Java2html

Check in on twitter

Twitter integrates the check in functionality on twitters (it is not a separate task like facebook). This means that the only we have to do is to make a post and provide in addition the geolocation information. In the figure below is the Java servlet code that does exactly that by employing the Scribe-Java library.



01 private String updateStatusOnTwitter(String accessTokena, String accessTokenb,
02  String message, String lat, String lon )throws MalformedURLException, IOException{


03  //========================post code==================================
04  String PROTECTED_RESOURCE_URL = "http://api.twitter.com/1/statuses/update.json"; 
05  OAuthService service = new ServiceBuilder()
06  .provider(TwitterApi.class)
07  
08  .apiKey("***********************")
09  .apiSecret("*****************************")
10  .build();
11  Token accessToken = new Token(accessTokena,accessTokenb);
12  System.out.println("Got the Access Token!");
13  System.out.println();
14  
15  // Now let's go and ask for a protected resource!
16  System.out.println("Now we're going to access a protected resource...");
17  OAuthRequest request = new OAuthRequest(Verb.POST, PROTECTED_RESOURCE_URL);
18  request.addBodyParameter("status", message);
19  request.addBodyParameter("lat", lat);
20  request.addBodyParameter("long", lon);
21  
22  service.signRequest(accessToken, request);
23  Response response = request.send();
24  return response.getBody();
25

26 }

Java2html

Auth, Facebook, Facebook Graph API, java, Javascript, OAuth, OAuth 2.0, servlet, Twitter

This entry was posted on 27th May 2011, 5:06 am and is filed under Project. You can follow any responses to this entry through RSS 2.0. You can leave a response, or trackback from your own site.

CyberTube