Face API Introduction & Implementation In Rails App

Face recognition has become a popular area of research in computer vision and one of the most successful applications of image analysis. Many cloud services are available on this.

Face.com provides one of the trusted service for detecting, recognizing, and tagging faces in any photo, through their REST API.  . We can tag and recognize users from Facebook or Twitter.

Face API can process image urls and even images by uploading. API response is in JSON format. It supports xml too. API library is available in Javascript, PHP, Java, Ruby, Python, C#, Objective-C etc.

For using any library of Face API, first we need a Face.com account.  Then you can create an application in developer mode and provide your website url, facebook app information etc.

Ruby library (https://github.com/rociiu/face)

Install gem face and include in app.

Use Face application keys here,

client = Face.get_client(:api_key => ‘your_api_key’, :api_secret => ‘your_api_secret’)

Ways to detect faces from image:

1, using image url:-

client.faces_detect(:urls => [‘image_url’])      -> use comma to separate urls.

2, using Raw image data:-

client.faces_detect(:file => File.new(‘image.jpg’, ‘rb’))

Using user auth:

1, Twitter:

client.twitter_credentials = { :twitter_username => ‘name’, :twitter_password => ‘password’ }

client.faces_recognize(:urls => [‘http://test.com/1.jpg’], :uids => [‘uiicor’])

2. Facebook:

client.facebook_credentials = { :fb_user => ‘identifier’, :fb_oauth_token => ‘access_token ‘}

client.faces_recognize(:urls => [‘http://test.com/1.jpg’], :uids => [‘friends@facebook.com’])

From the json results for face detection and recognization requests, we can extract face postion and other informations. These can be used with tagging scripts.

Javascript Tagger Widget and Client Library

Face API Tagger widget and Client Library can be used to implement tagging service like facebook.

Click here to download Javascript Tagger Widget

Click here to download Javascript Client Library

Include .js files downloaded and do as following,

<img id="simage" src="image_url" alt="" />

<script type="text/javascript"> function detectFaces(){ FaceTagger.load("#simage",  { facebook: true,  click_add_tag: false,  show_loading: true,  tagClick: tag_clicked,  tagSaved: tag_saved,  success: tag_success,  resizable: true,  tags_visible: true,  fade: false,  tags_list: true,  add_tag_button: true,  tags_list: true,  error: tagger_error});} </script>

<script type="text/javascript"> FaceClientAPI.init('facekey');  detectFaces(); </script>

tag_clicked, tag_saved, tag_success and tagger_error  -> are callback functions.

facebook: true  -> enables to tag facebook friends.

face_key  -> Face.com application key.

Should provide facebook app key and secret key in face.com developer account. Use a facebook login button for your app together with image to be tagged.

If you gets any error with jquery script files, freeze following scripts in tagger.js (dowloaded .js file)

/*

 if (typeof jQuery == 'undefined')

  loadJavaScript("http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.js");

 if (typeof jQuery.ui == 'undefined')

  loadJavaScript("http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/jquery-ui.min.js");

*/

Then include following in your html header

<script type="text/javascript" src="http://agileblaze.com/wp-content/uploads/2012/01/jquery.js"> </script>

<script type="text/javascript" src="http://agileblaze.com/wp-content/uploads/2012/01/jquery-ui.min.js"></script>

Since Facebook have some updation with authentication(Oauth 2.0), there is a chance for error with facebook connection while tagging. If you have any, tagger.js have to be edited by replacing following lines,

var osession = oldFBApi ? FB.Facebook.apiClient.get_session() : response.session;      with    

var osession = oldFBApi ? FB.Facebook.apiClient.get_session() : response.authResponse;

var uid = osession.uid;    with    var uid = osession.userID;

m_fbSession = osession.session_key;     with    m_fbSession = osession.accessToken;

Demo:  http://faceapi-demo.heroku.com/

In short,  developers can integrate these services to their web apps for free with some API call rate limits. They also provides whitelisting to avoid rate limits by maintaining some policies.