Updated post with source code available here.
In today’s world, with everyone managing multiple online accounts, it painful for users to create and remember yet another set of new credential just for your application. To overcome this issue we can use social networking API but this too has other drawbacks. For example, how many social networking API are you going to implement and maintain? There dozens of well known social networking sites and new ones coming up everyday!
For newer Rails applications we recommend using a combination of Devise and Omniauth but this may not always serve the purpose for older sites with different types of authentication schemes. With Gigya register widget we got rid of all these problem – it provides login for almost all social networking site. Using Gigya you can perform different functionality of various social networking portals/application. It’s easy to use Gigya login in an application to sign-up and login to application through various social networking credentials
Setting it up
You (as a developer) just need to sign up with gigya (Yes – just one more account credential to remember!) and create a API token and key. After you login, you can click here to choose what you want to show in your sign up or login page and choose other display option for the widgets.
This generates the two parts of code snippets to used in application, one is to access the gigya JavaScript objects and another one is to show the gigya widget in your application page.
This link provides various ways to use social networking login in your application
1. One-step registration
2. Full Registration
3. Full registration with account
4. Custom registration flow
5. Independent connect
Here, I’m talking about #2 Full registration. This link gives detailed steps of what to do along with a flow chart! I am mentioning the additional steps I did to customize it further for me.
I added the following configuration in config.yml
gigya: api_key: <your API key> secret: <your secret> providers: facebook,twitter #,myspace,yahoo,google,openid signup_redirect_url: http://<your-app-url>/social_signup login_redirect_url: http://<your-app-url>/social_login logout_url: http://<your-app-url>/logout
Now, this is the basic Gigya code to the gigya widget to load properly.
<head> <script type="text/javascript" language="javascript" src="http://cdn.gigya.com/js/socialize.js?apiKey=<%= ApplicationConfig['gigya']['api_key'] %>"></script> </head> <script type="text/javascript"> var conf= { APIKey: '<%= ApplicationConfig['gigya']['api_key'] %>' ,enabledProviders: '<%= ApplicationConfig['gigya']['providers'] %>' }; var login_params= { showTermsLink: false ,height: 80 ,width: 267 ,containerID: 'loginDiv' ,UIConfig: '<config><body><background background-color="Transparent"></background><controls><snbuttons buttonsize="50"></snbuttons></controls></body></config>' ,useFacebookConnect: true ,redirectURL: '<%= ApplicationConfig['gigya']['login_redirect_url'] %>' ,buttonsStyle: 'fullLogo' }; gigya.services.socialize.showLoginUI(conf,login_params); function logout(isGigyaLogin) { if(isGigyaLogin == true){ gigya.services.socialize.logout(conf, { callback:'' }); gigya.services.socialize.disconnect(conf, { callback:'', provider:'<%= current_user.provider %>' }); } window.location = '/logout'; return true; } </script>
We need to verify the authenticity of the signature received from Gigya. I added the following code snippet in my Rails app for this functionality
def is_valid_gigya_signature gigya_signature = params[:signature] base_string = params[:timestamp]+"_"+params[:UID] key = ApplicationConfig['gigya']['secret'] digest = OpenSSL::HMAC.digest(OpenSSL::Digest::Digest.new('sha1'), Base64.decode64(key), base_string) return false if gigya_signature != Base64.encode64(digest).chomp return true end
Gotcha!
An interesting pointer – something which took me sometime to figure out. Gigya calls back the URL you have specified but as a GET request. So, all the parameters are visible in the URL. If you do want to avoid showing this, you should have an internal redirect in your callback to ensure that parameters are not seen in the URL. Of course, before redirecting, you need to store the info. I did this like this:
# Redirect-url for signup process def social_signup #Valid gigya signature to avoid fraud if !is_valid_gigya_signature respond_to do |format| flash[ :notice ] = I18n.t( :invalid_gigya_signature, :scope => :notice ) format.html { render :action => 'new' } # On FAILURE! end end reg_user = User.find_by_uid(params[:UID]) #Check the user already registered if !reg_user.blank? respond_to do |format| flash[ :notice ] = I18n.t( :user_already_registered, :scope => :notice, :provider => params[:provider] ) # REDIRECT to Login for Existing User! format.html { redirect_to login_url } end else store_gigya_user_info respond_to do |format| # REDIRECT on success! format.html { redirect_to social_connect_url } end end end
Account Linking
We need to ensure that we also cater to this. Suppose a users signs up via Facebook and the next day tries with twitter — we cannot afford to have 2 different users. We need to find a way to link these user accounts so that a user can login/signup with any social account and still be the same user! To do this — we ensure we had the following routes:
map.social_signup '/social/signup', :controller => 'users', :action => 'social_signup' map.social_connect '/social/connect', :controller => 'users', :action => 'social_connect' map.social_register '/social/register', :controller => 'users', :action => 'social_register' map.social_login '/social/login', :controller => 'sessions', :action => 'social_login' map.social_account_linking '/social/:user_id/linking', :controller => 'users', :action => 'social_account_linking' map.social_account_add '/social/:user_id/add', :controller => 'users', :action => 'social_account_add'
As the named routes suggest, we can now signup, register or even link accounts. To make things simple, I have the code ready for this — Use at will.
Code is available here: https://github.com/joshsoftware/sso-gigya-widget
Please provide feedback, bugs, suggestions
Is this still relevant over a year later?
Hello, for all time i used to check website posts here early in the dawn, because i enjoy
to find out more and more.
Hi there, i read your blog from time to time and i own a similar one and i was just wondering if you get a lot of spam feedback? If so how do you protect against it, any plugin or anything you can suggest? I get so much lately it’s driving me insane so any help is very much appreciated.
Hi there! This article couldn’t be written much better! Reading through this post reminds me of my previous roommate! He continually kept talking about this. I’ll send this information to him. Fairly certain he will have a good read. Thanks for sharing!
What’s up friends, pleasant paragraph and good arguments commented at this place, I am truly enjoying by these.
I like the valuable information you provide in your articles. I’ll bookmark your blog and check again here frequently. I am quite certain I will learn many new stuff right here! Best of luck for the next!
Thanks , I have recently been looking for information about this subject for a long time and yours is the best I have found out so far. However, what concerning the conclusion? Are you sure about the supply?
This is really attention-grabbing, You are an overly professional blogger. I’ve joined your rss feed and look ahead to in search of extra of your wonderful post. Additionally, I’ve shared your website in my social networks
Good post. I learn something totally new and challenging on sites I stumbleupon everyday. It will always be useful to read through content from other writers and use something from other web sites.
Do you mind if I quote a few of your articles as long as I provide credit and sources back to your weblog? My blog site is in the exact same niche as yours and my users would certainly benefit from a lot of the information you present here. Please let me know if this alright with you. Thanks a lot!
Nice answers in return of this issue with genuine arguments and describing all concerning that.
Hi there to every , since I am really eager of reading this weblog’s post to be updated daily. It consists of nice material.
hi how to use gigya for sencha touch app ?