Cross-Platform Authentication with Google+ Sign-In

3,007 views

Published on

This presentations outlines how Google+ Sign-In allows your users to sign in once and then be signed in seamlessly across all of your apps. The session takes a look at Google+ Sign-in authentication models and highlights common pitfalls and best practices.

Published in: Technology
0 Comments
3 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
3,007
On SlideShare
0
From Embeds
0
Number of Embeds
76
Actions
Shares
0
Downloads
27
Comments
0
Likes
3
Embeds 0
No embeds

No notes for slide

Cross-Platform Authentication with Google+ Sign-In

  1. 1. Cross-Platform Auth with Google+ Sign-In Google+ Platform Peter Friese - Developer Advocate
  2. 2. Peter Friese - Developer Advocate +PeterFriese @peterfriese http://www.peterfriese.de
  3. 3. What is Google+ ?
  4. 4. https://www.flickr.com/photos/dainbinder/10538549606/
  5. 5. http://openclipart.org/detail/26329/aiga-immigration-bg-by-anonymous
  6. 6. What is Authentication?
  7. 7. What is Authentication? αὐθεντικός (greek): ! “that comes from the author” / authentic /original /genuine Authentication: ! The act of confirming the truth of an attribute of a datum or an entity. datum or an entity.
  8. 8. Authentication Factors Ownership Knowledge Inherence https://www.flickr.com/photos/europealacarte/9152848988/ https://www.flickr.com/photos/gcfairch/3595771919/https://www.flickr.com/photos/z0/5055081370/
  9. 9. Authentication - How hard can it be? https://www.flickr.com/photos/isherwoodchris/7018779395/
  10. 10. Quite hard, actually! https://www.flickr.com/photos/govwin/5609940697/ Things to consider • Encrypt traffic • Hash + salt passwords • Two-factor auth • Account recovery http://upload.wikimedia.org/wikipedia/commons/4/41/Space_Shuttle_Columbia_launching.jpg
  11. 11. You might end up in the News
  12. 12. On the shoulders of Giants… https://www.flickr.com/photos/govwin/5609940697/ Use an identity provider • Easier for you • Easier for the user • Established, trusted brand • Focus on your business model (rather than re-inventing the wheel) http://www.nasa.gov/centers/dryden/images/content/690557main_SCA_Endeavour_over_Ventura.jpg
  13. 13. ± KEEP CALM AND SIGN IN WITH
 GOOGLE+
  14. 14. Google+ Sign-in Features
  15. 15. Google: trusted brand 2-factor verification, using your phone Works alongside existing sign-in systems Secure Authentication Google+ Sign-in Features Learn more about your users (with their consent)
  16. 16. Sign-in to web site Cross-Device Single Sign-on and Over-the-Air Install (OTA) Google+ Sign-in Features
  17. 17. Sign-in to web site Cross-Device Single Sign-on and Over-the-Air Install (OTA) Google+ Sign-in Features
  18. 18. Sign-in to web site Cross-Device Single Sign-on and Over-the-Air Install (OTA) Google+ Sign-in Features
  19. 19. Sign-in to web site Cross-Device Single Sign-on and Over-the-Air Install (OTA) Google+ Sign-in Features OTA consent dialog
  20. 20. Sign-in to web site Cross-Device Single Sign-on and Over-the-Air Install (OTA) Google+ Sign-in Features OTA consent dialog OTA installation
  21. 21. Sign-in to web site Cross-Device Single Sign-on and Over-the-Air Install (OTA) Google+ Sign-in Features OTA consent dialog OTA installation
  22. 22. Sign-in to web site Cross-Device Single Sign-on and Over-the-Air Install (OTA) Google+ Sign-in Features OTA consent dialog OTA installation Auto signed in on other device
  23. 23. Sign-in to web site Cross-Device Single Sign-on and Over-the-Air Install (OTA) Google+ Sign-in Features OTA consent dialog OTA installation Auto signed in on other device
  24. 24. How does Google+ Sign-in work?
  25. 25. AppUser Google Based on OAuth 2.0 How does Google+ Sign-in work? Consent Permission
  26. 26. AppUser Google Based on OAuth 2.0 How does Google+ Sign-in work? Consent Permission No password sharing Scoped access Revocable
  27. 27. Implementing Google+ Sign-in
  28. 28. Developer Console Project Setting up https://developers.google.com/console APIs Credentials iOS Client ID Android Client ID Web Client ID Branding Permissions Management
  29. 29. Developer Console Project Setting up https://developers.google.com/console APIs Credentials iOS Client ID Android Client ID Web Client ID Branding Permissions Management One project, multiple clients
  30. 30. Developer Console Project Setting up https://developers.google.com/console APIs Credentials iOS Client ID Android Client ID Web Client ID Branding Permissions Management One project, multiple clients Authorization is granted to your application, not a specific client! * Single user consent across devices * Cross-Device Single Sign-on * Available for Web & Android
  31. 31. You Google The Auth Triangle Connecting lines need authentication Client Server Google APIs
  32. 32. You Google Client Server Google APIs Client Authentication
  33. 33. Client Authentication
  34. 34. Create OAuth 2.0 client ID Link with Google Play Services API Setup Sign-In Overview Client Authentication: Android
  35. 35. SDK Architecture Client Authentication: Android iOS Your App Google APIs Google Play Client Library Google Play Services APK Authorize using existing accounts on Android device
  36. 36. mApiClient = new GoogleApiClient.Builder(this) .addConnectionCallbacks(this) .addOnConnectionFailedListener(this) .addApi(Plus.API, null) .addScope(Plus.SCOPE_PLUS_LOGIN) .build(); Java GoogleApiClient Lifecycle Client Authentication: Android onCreate() onStart() mApiClient.connect(); Java onStop() if (mApiClient.isConnected()) { mApiClient.disconnect(); } Java <com.google.android.gms.common.SignInButton android:id="@+id/sign_in_button" android:layout_width="wrap_content" android:layout_height="wrap_content"/> XML running
  37. 37. Handle connection failure Client Authentication: Android public void onConnectionFailed(ConnectionResult result) { if (!mIntentInProgress && result.hasResolution()) { try { mIntentInProgress = true; startIntentSenderForResult(result.getResolution().getIntentSender(), RC_SIGN_IN, null, 0, 0, 0); } catch (SendIntentException e) { // The intent was canceled before it was sent. Return to the default // state and attempt to connect to get an updated ConnectionResult. mIntentInProgress = false; mApiClient.connect(); } } } Java
  38. 38. Handle connection failure Client Authentication: Android public void onConnectionFailed(ConnectionResult result) { if (!mIntentInProgress && result.hasResolution()) { try { mIntentInProgress = true; startIntentSenderForResult(result.getResolution().getIntentSender(), RC_SIGN_IN, null, 0, 0, 0); } catch (SendIntentException e) { // The intent was canceled before it was sent. Return to the default // state and attempt to connect to get an updated ConnectionResult. mIntentInProgress = false; mApiClient.connect(); } } } Java User needs to select account, consent to permissions, ensure network connectivity, etc. to connect
  39. 39. Connection successful Client Authentication: Android public void onConnected(Bundle connectionHint) { // Retrieve some profile information to personalize our app for the user. Person currentUser = Plus.PeopleApi.getCurrentPerson(mApiClient); // Indicate that the sign in process is complete. mSignInProgress = STATE_DEFAULT; } Java
  40. 40. Create OAuth 2.0 client ID Integrate SDK Setup Sign-In Overview Client Authentication: iOS
  41. 41. iOS Your App Google APIs Google+ iOS SDK SDK Architecture Client Authentication: iOS Statically linked library
  42. 42. #import <GooglePlus/GooglePlus.h> #import <GoogleOpenSource/GoogleOpenSource.h> ! ... ! ! GPPSignIn *signIn = [GPPSignIn sharedInstance]; signIn.shouldFetchGoogleUserEmail = YES; ! signIn.clientID = @“YOUR_CLIENT_ID”; signIn.scopes = @[@"profile"]; signIn.delegate = self; Objective-C Configure Sign-In Client Authentication: iOS
  43. 43. Perform Sign-In, Option 1 (use our button) Client Authentication: iOS
  44. 44. Create own button / use action sheet / … // trigger sign-in [[GPPSignIn sharedInstance] authenticate]; Objective-C Silent sign-in if user has signed in before: // silently sign in [[GPPSignIn sharedInstance] trySilentAuthentication]; Objective-C Perform Sign-In, Option 2 (create your own button) Client Authentication: iOS
  45. 45. Receiving the authorisation Client Authentication: iOS // In ApplicationDelegate - (BOOL)application:(UIApplication *)application openURL:(NSURL *)url sourceApplication:(NSString *)sourceApplication annotation:(id)annotation { return [GPPURLHandler handleURL:url sourceApplication:sourceApplication annotation:annotation]; } ! ! // GPPSignInDelegate - (void)finishedWithAuth:(GTMOAuth2Authentication *)auth error:(NSError *)error { if (!error) { NSString *gplusId = [GPPSignIn sharedInstance].userID; } } Objective-C
  46. 46. Create OAuth 2.0 client ID Include JavaScript client on your web page Add Google+ Sign-in button Handle callback Overview Client Authentication: Web
  47. 47. Browser Your site Google APIsplusone.js Architecture Client Authentication: Web
  48. 48. <div id="gConnect"> <button class="g-signin" data-scope="https://www.googleapis.com/auth/plus.login" data-requestvisibleactions="http://schemas.google.com/AddActivity" data-clientId="YOUR_CLIENT_ID" data-callback="onSignInCallback" data-cookiepolicy="single_host_origin"> </button> </div> ! <!-- Place plusone.js asynchronous JavaScript just before your </body> tag —> HTML Integrate sign-in button Client Authentication: Web
  49. 49. function onSignInCallback(authResult) { if (authResult['access_token']) { // Successfully authorized } else if (authResult['error']) { // User is not signed in. } } JavaScript Handle authorization callback Client Authentication: Web
  50. 50. Server Authentication You Google Client Server Google APIs
  51. 51. One-Time-Code Flow C li e n t S e r v e r Google APIs 1: Client-side auth request 2: OAuth dialog triggeredOAuth 2.0 Dialog 3: access_token, one-time code, id_token 4: one-time code 5: exchange one-time codefor access_token andrefresh_token 6: access_token, refresh_token 7: “fully logged in”
  52. 52. <div id="gConnect"> <button class="g-signin" data-scope="https://www.googleapis.com/auth/plus.login" data-requestvisibleactions="http://schemas.google.com/AddActivity" data-clientId="YOUR_CLIENT_ID" data-callback="onSignInCallback" data-cookiepolicy=“single_host_origin"> data-callback="signInCallback"> </button> </div> ! <!-- Place plusone.js asynchronous JavaScript just before your </body> tag —> HTML Integrate sign-in button Server Auth: One-Time Code
  53. 53. function signInCallback(authResult) { if (authResult['code']) { // Send the code to the server $.ajax({ type: 'POST', url: 'plus.php?storeToken', contentType: 'application/octet-stream; charset=utf-8', success: function(result) { // Handle or verify the server response if necessary. console.log(result); } else { $('#results').html('Failed to make a server-side call.'); } }, processData: false, data: authResult['code'] }); } else if (authResult['error']) { console.log('There was an error: ' + authResult['error']); } } JavaScript Handle authorization callback Server Auth: One-Time Code
  54. 54. $code = $request->getContent(); ! // Exchange the OAuth 2.0 authorization code for user credentials. $client->authenticate($code); ! $token = json_decode($client->getAccessToken()); ! // Verify the token ... ! // Store the token in the session for later use. $app['session']->set('token', $client->getAccessToken()); $response = 'Successfully connected with token: ' . print_r($token, true); PHP Exchange one-time code Server Auth: One-Time Code
  55. 55. Best practices and Common Pitfalls
  56. 56. Best practices and Common Pitfalls Common Pitfalls Guidelines Best practices Useful resources
  57. 57. Guidelines • Use our client libraries (they’re well debugged) instead of rolling your own HTTP requests • Provide a way for the user to sign out / disconnect your app • Use “Sign in with Google” when labelling your sign in buttons. Don’t use “Sign in with Google+” • Equal rights to everyone: sign-in buttons should be equally sized for all networks you support • Ask only for permissions you really need. Also, consider using incremental auth - this will likely increase sign-up rates.
  58. 58. Pitfalls: iOS • Not providing a URL type for callback • Not providing the ApplicationDelegate application:openURL:sourceApplication: annotation: callback or failing to call GPPURLHandler handleURL:sourceApplication:annotation
  59. 59. Best practices and Common Pitfalls deprecated) Use Stop using profile (for basic login) https://www.googleapis.com/auth/userinfo.profile plus.login (if you need more info about a user. Includes profile) email (the user’s email address) https://www.googleapis.com/auth/userinfo.email
  60. 60. Useful resources • Scopes
 https://developers.google.com/+/api/oauth#scopes • Developer Console
 https://console.developers.google.com/project • OAuth 2.0 Playground
 https://developers.google.com/oauthplayground/ • Tokeninfo
 https://www.googleapis.com/oauth2/v1/tokeninfo?access_token=
  61. 61. Review
  62. 62. • Do not build your own authentication system • Google+ makes authentication easy • Authentication models depends on architecture • Learn more: check out our Quickstarts at 
 https://developers.google.com/+/ and 
 https://github.com/googleplus Cross-Platform Auth With Google+ Sign-in Review
  63. 63. <Thank You!> developers.google.com/+ Peter Friese - Developer Advocate +PeterFriese @peterfriese http://www.peterfriese.de

×