Se ha denunciado esta presentación.
Utilizamos tu perfil de LinkedIn y tus datos de actividad para personalizar los anuncios y mostrarte publicidad más relevante. Puedes cambiar tus preferencias de publicidad en cualquier momento.
Cross-Platform Auth
with Google+ Sign-In
Google+ Platform
Peter Friese - Developer Advocate
Peter Friese - Developer Advocate
+PeterFriese
@peterfriese
http://www.peterfriese.de
What is Google+ ?
https://www.flickr.com/photos/dainbinder/10538549606/
http://openclipart.org/detail/26329/aiga-immigration-bg-by-anonymous
What is Authentication?
What is Authentication?
αὐθεντικός (greek):
!
“that comes from the author” /
authentic /original /genuine
Authentication:
...
Authentication Factors
Ownership Knowledge Inherence
https://www.flickr.com/photos/europealacarte/9152848988/ https://www.fl...
Authentication - How hard can it be?
https://www.flickr.com/photos/isherwoodchris/7018779395/
Quite hard, actually!
https://www.flickr.com/photos/govwin/5609940697/
Things to consider
• Encrypt traffic
• Hash + salt pa...
You might end up in the News
On the shoulders of Giants…
https://www.flickr.com/photos/govwin/5609940697/
Use an identity provider
• Easier for you
• Ea...
±

KEEP CALM

AND

SIGN IN

WITH

GOOGLE+
Google+ Sign-in Features
Google: trusted brand
2-factor verification, using your phone
Works alongside existing sign-in systems
Secure Authenticatio...
Sign-in to web site
Cross-Device Single Sign-on and Over-the-Air Install (OTA)
Google+ Sign-in Features
Sign-in to web site
Cross-Device Single Sign-on and Over-the-Air Install (OTA)
Google+ Sign-in Features
Sign-in to web site
Cross-Device Single Sign-on and Over-the-Air Install (OTA)
Google+ Sign-in Features
Sign-in to web site
Cross-Device Single Sign-on and Over-the-Air Install (OTA)
Google+ Sign-in Features
OTA consent dialog
Sign-in to web site
Cross-Device Single Sign-on and Over-the-Air Install (OTA)
Google+ Sign-in Features
OTA consent dialog...
Sign-in to web site
Cross-Device Single Sign-on and Over-the-Air Install (OTA)
Google+ Sign-in Features
OTA consent dialog...
Sign-in to web site
Cross-Device Single Sign-on and Over-the-Air Install (OTA)
Google+ Sign-in Features
OTA consent dialog...
Sign-in to web site
Cross-Device Single Sign-on and Over-the-Air Install (OTA)
Google+ Sign-in Features
OTA consent dialog...
How does Google+ Sign-in work?
AppUser
Google
Based on OAuth 2.0
How does Google+ Sign-in work?
Consent Permission
AppUser
Google
Based on OAuth 2.0
How does Google+ Sign-in work?
Consent Permission
No password sharing
Scoped access
Revo...
Implementing Google+ Sign-in
Developer Console Project
Setting up
https://developers.google.com/console
APIs
Credentials
iOS Client ID
Android Client I...
Developer Console Project
Setting up
https://developers.google.com/console
APIs
Credentials
iOS Client ID
Android Client I...
Developer Console Project
Setting up
https://developers.google.com/console
APIs
Credentials
iOS Client ID
Android Client I...
You Google
The Auth Triangle
Connecting lines
need authentication
Client
Server
Google APIs
You Google
Client
Server
Google APIs
Client Authentication
Client Authentication
Create OAuth 2.0 client ID
Link with Google Play Services API
Setup Sign-In
Overview
Client Authentication: Android
SDK Architecture
Client Authentication: Android
iOS
Your App
Google APIs
Google Play
Client Library
Google Play
Services A...
mApiClient = new GoogleApiClient.Builder(this)	
.addConnectionCallbacks(this)	
.addOnConnectionFailedListener(this)	
.addA...
Handle connection failure
Client Authentication: Android
public void onConnectionFailed(ConnectionResult result) {	
	 if (...
Handle connection failure
Client Authentication: Android
public void onConnectionFailed(ConnectionResult result) {	
	 if (...
Connection successful
Client Authentication: Android
public void onConnected(Bundle connectionHint) { 	
	 // Retrieve some...
Create OAuth 2.0 client ID
Integrate SDK
Setup Sign-In
Overview
Client Authentication: iOS
iOS
Your App
Google APIs
Google+
iOS SDK
SDK Architecture
Client Authentication: iOS
Statically linked library
#import <GooglePlus/GooglePlus.h>
#import <GoogleOpenSource/GoogleOpenSource.h>
!
...
!
!
GPPSignIn *signIn = [GPPSignIn s...
Perform Sign-In, Option 1 (use our button)
Client Authentication: iOS
Create own button / use action sheet / …
// trigger sign-in
[[GPPSignIn sharedInstance] authenticate];
Objective-C
Silent ...
Receiving the authorisation
Client Authentication: iOS
// In ApplicationDelegate
- (BOOL)application:(UIApplication *)appl...
Create OAuth 2.0 client ID
Include JavaScript client on your web page
Add Google+ Sign-in button
Handle callback
Overview
...
Browser
Your site
Google APIsplusone.js
Architecture
Client Authentication: Web
<div id="gConnect">
<button class="g-signin"
data-scope="https://www.googleapis.com/auth/plus.login"
data-requestvisibleac...
function onSignInCallback(authResult) {
if (authResult['access_token']) {
// Successfully authorized
} else if (authResult...
Server Authentication
You Google
Client
Server
Google APIs
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
Dialo...
<div id="gConnect">
<button class="g-signin"
data-scope="https://www.googleapis.com/auth/plus.login"
data-requestvisibleac...
function signInCallback(authResult) {
if (authResult['code']) {
// Send the code to the server
$.ajax({
type: 'POST',
url:...
$code = $request->getContent();
!
// Exchange the OAuth 2.0 authorization code for user credentials.
$client->authenticate...
Best practices and Common Pitfalls
Best practices and Common Pitfalls
Common Pitfalls
Guidelines
Best practices
Useful resources
Guidelines
• Use our client libraries (they’re well debugged) instead of rolling your
own HTTP requests
• Provide a way fo...
Pitfalls: iOS
• Not providing a URL type for callback
• Not providing the ApplicationDelegate
application:openURL:sourceAp...
Best practices and Common Pitfalls
deprecated)
Use Stop using
profile
(for basic login)
https://www.googleapis.com/auth/us...
Useful resources
• Scopes

https://developers.google.com/+/api/oauth#scopes
• Developer Console

https://console.developer...
Review
• Do not build your own authentication system
• Google+ makes authentication easy
• Authentication models depends on archi...
<Thank You!>
developers.google.com/+
Peter Friese - Developer Advocate
+PeterFriese
@peterfriese
http://www.peterfriese.de
Próxima SlideShare
Cargando en…5
×

Cross-Platform Authentication with Google+ Sign-In

3.612 visualizaciones

Publicado el

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.

Publicado en: Tecnología
  • Sex in your area is here: ♥♥♥ http://bit.ly/2F90ZZC ♥♥♥
       Responder 
    ¿Estás seguro?    No
    Tu mensaje aparecerá aquí

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

×