Skip to main content

Night of the living programmer - Facebook login in Java web application

It is a sunny Saturday, not often in autumn of Seattle. For quite a while, I've been waited for such a chance to walk peacefully in Olympic Sculpture Park. On the other side, I also always wanted to add a "Login with Facebook" button to my new website to attract users as the popularity of the website just about to reach all time low. So the plan is, finishing the login button before afternoon, have peaceful walk during sunset, which would be nice, and watch a relaxing DVD before sleep.

With this guide, adding a button with popup login window wasn't difficult. Out of box, div element with class fb-login-button is decorated as long as Facebook Javascript SDK is included.  The script snippet in tutorial is mostly to enable Javascript SDK in an asynchronous fashion for performance gain. The only gotcha is that the URL of page with button must be under a registered domain of application. I did local testing by modifying my /etc/hosts and mapping local.mydomain.com to 127.0.0.1.

However from this tutorial it isn't clear how the data that application asks user the access for, is accessed or passed over to application? In my first attempt, the pop up window asked for login information, permission to access a few fields, then closed as if it has nothing to do with the Java code running on the server side of application. My guess is that the access token used to make "/me" call should be passed as a parameter to a given URL under mydomain.com, but the tutorial doesn't say anything about it, it doesn't even say how the redirect URL is configured.

Reading further in authentication concept, I realized I could do a three-step authentication all by myself without Javascript SDK or fb-login-button class. It'd give me decent chance to smoothly embed my Java page into the process and get access token, which of course, requires a little bit of work. But then I wonder what's the purpose of the nice fb-login-button class button.

After playing for a while, it turns out in the simple fb-login-button approach, after authentication is done and window is closed, the useful access token that I expected is left in a cookie named fbs_<app-id>. I can totally redirect to an empty page that picks up this cookie after login window is closed. Follow this direction, my application ends up with:

<div  class="fb-login-button" data-perms="email"
        onlogin="location.href='/do_land_facebook.html"
        title="You may sign in right away if you have a facebook account">
    Login with Facebook</div> 

The do_land_facebook.html is back'ed with following Java code that picks up cookie and call "/me" api.

String cookieName = "fbs_" + config.getFacebookAppId();
Cookie fbCookie = null;
for ( Cookie cookie : request.getCookies() )
{
    if ( cookie.getName().equals( cookieName ) )
    {
        fbCookie = cookie;
        break;
    }
}
if ( fbCookie == null )
{    // This could happen when user clicks cancel button
    // The onlogin event is triggered no matter user clicks Login or Cancel
    return "redirect:/login_failed.html"; // It happens to be a SpringMVC based application
}
    // The cookie value is the exact query string required to call facebook API
InputStream in = new URL( "https://graph.facebook.com/me?" + fbCookie.getValue() ).openStream();
try
{
    String content = IOUtils.toString( in );
    LOG.info( "Received facebook response: " + content );
    JSONObject me = new JSONObject( content );
    loginWithFacebook(request, me); // Do my own login code logic with given JSON object graph
    return "redirect:/index.html";
}
finally 
{
    IOUtils.closeQuitely( in );
}

Finally everything starts working. I'm still debating with myself whether to do the three step authentication without Javascript SDK, or leave it as is. Maybe I will make this decision tomorrow with a dice.

Another thing I just realized, sunset is gone now and it's pitch black outside. Time went so fast and it's already the time to watch relaxing horror movie. What a Saturday.

Comments

Popular posts from this blog

Spring, Angular and other reasons I like and hate Bazel at the same time

For several weeks I've been trying to put together an Angular application served Java Spring MVC web server in Bazel. I've seen the Java, Angular combination works well in Google, and given the popularity of Java, I want get it to work with open source. How hard can it be to run arguably the best JS framework on a server in probably the most popular server-side language with  the mono-repo of planet-scale ? The rest of this post walks through the headaches and nightmares I had to get things to work but if you are just here to look for a working example, github/jiaqi/angular-on-java is all you need. https://github.com/jiaqi/angular-on-java Java web application with Appengine rule Surprisingly there isn't an official way of building Java web application in Bazel, the closest thing is the Appengine rule  and Spring MVC seems to work well with it. 3 Java classes, a JSP and an appengine.xml was all I need. At this point, the server starts well but I got "No

Wreck-it Ralph is from Chicago?

Hotel Felix in Chicago   The building of Fix-it Felix Jr.  

Project Euler problem 220 - Heighway Dragon

This document goes through a Java solution for Project Euler problem 220 . If you want to achieve the pleasure of solving the unfamiliarity and you don't have a solution yet, PLEASE STOP READING UNTIL YOU FIND A SOLUTION. Problem 220 is to tell the coordinate after a given large number of steps in a Dragon Curve . The first thing came to my mind, is to DFS traverse a 50 level tree by 10^12 steps, during which it keeps track of a direction and a coordinate. Roughly estimate, this solution takes a 50 level recursion, which isn't horrible, and 10^12 switch/case calls. Written by a lazy and irresponsible Java engineer, this solution vaguely looks like: Traveler traveler = new Traveler(new Coordinate(0, 0), Direction.UP); void main() { try { traverse("Fa", 0); } catch (TerminationSignal signal) { print signal; } } void traverse(String plan, int level) { foreach(char c:plan) { switch(c) { case 'F': traveler.stepForward(); break; ca