SlideShare a Scribd company logo
1 of 15
Download to read offline
OAuth2
Kent Tong, TipTec Development © 2018
OAuth2: Using your Google or Facebook account
with other web apps
Redirecting the user to authentication server
Your web
app
Browser
Google
Redirect to:
https://auth.google.com
http://localhost/myapp
https://auth.google.com
https://auth.google.com
Redirect the user to Google,
Facebook, etc.
User logging in and granting permission to the app
Google
Grant permission to
app 123?
Browser
OK
Your web
app
http://localhost/myapp
Redirect to:
http://localhost/myapp/resume?
access_token=abc
Using the access token, the
web app can do things as the
user.
Redirect the browser
to the web app.
...
access_token=abc
But wait!
Google
Grant permission to
app 123?
Browser
OK
Your web
app
http://localhost/myapp
Redirect to:
http://localhost/myapp/resume?
access_token=abc
How does Google
know the URL of
your web app?
How does Google know
the name of your web app
(app 123)?
Your web app needs to tell Google its name &
resume URL at the beginning
Your web
app
Browser
Google
Redirect to:
https://auth.google.com ?
client_id=app123&
redirect_url=http://localhost/myapp/resume
http://localhost/myapp
https://auth.google.com ?
client_id=...&
redirect_url=...
Your web app provides
its name and resume
URL to Google via the
browser.
User logging in and granting permission to the app
Google
https://auth.google.com
Grant permission to
app 123?
Browser
OK
Your web
app
http://localhost/myapp
Redirect to:
http://localhost/myapp/resume?
access_token=abc
...
access_token=abc
Acting as the user to do things (e.g., retrieve his
profile info)
Google
https://profile.google.com
Your web
app
https://profile.google.com?
clientId=app123&
access_token=abc
{
"user_name":"kent",
...
}
May be a dedicated server
for retrieving user profile.
However, the token is for the web app but handed to
the browser
Google
Grant permission to
app 123?
Browser
OK
Redirect to:
http://localhost/myapp/resume?
access_token=abc
If the browser has been hacked, the
hacker can use the access token and
pretend to be your web app.
Your web
app
...
access_token=abc
Sending an authorization code instead of the access
token
Google
Grant permission to
app 123?
Browser
OK
Your web
app
Redirect to:
http://localhost/myapp/resume? code=xyz
...?code=xyz
The authorization code CANNOT be used to do
things as the user
Google
https://profile.google.com
Browser or
hacker
https://profile.google.com?
clientId=app123&
access_token=xyz
"invalid access
token"
The app can get an access token with the
authorization code
Google
https://token.google.com
Grant permission to
app 123?
Browser
OK
Your web
app
...?code=xyz
https://token.google.com?
client_id=app123&
client_secret=aaa
code=xyz
{
"access_token":"abc",
...
}
Google Only the web app and Google
know this client secret.
Allow?
Redirect.
May be a dedicated
server for getting an
access token.
Acting as the user to do things
Google
https://profile.google.com
Your web
app
http://localhost/myapp
https://profile.google.com?
clientId=app123&
access_token=abc
{
"user_name":"kent",
...
}
The app wants everything or just simple things like
email?
Your web
app
Browser
Google
Redirect to:
https://auth.google.com?
client_id=app123&
scope=public_info&
redirect_url=http://localhost/myapp/resume
https://auth.google.comhttps://auth.google.com?
client_id=app123&
scope=public_info&
...
The available scope
values and meanings
are decided by the
auth server.
app wants everything or just simple things like
email?
Google
https://auth.google.com
Grant permission to
read your public
info to app 123?
Browser
OK
Your web
app
Redirect

More Related Content

What's hot

Intro to developing for @twitterapi
Intro to developing for @twitterapiIntro to developing for @twitterapi
Intro to developing for @twitterapi
Raffi Krikorian
 

What's hot (14)

How Do Search Engines Work
How Do Search Engines WorkHow Do Search Engines Work
How Do Search Engines Work
 
VRAD INFO
VRAD INFOVRAD INFO
VRAD INFO
 
Search Engine Optimization - Fundamentals - SEO
Search Engine Optimization - Fundamentals - SEOSearch Engine Optimization - Fundamentals - SEO
Search Engine Optimization - Fundamentals - SEO
 
Api
ApiApi
Api
 
Web Services
Web ServicesWeb Services
Web Services
 
3 Quick accessibility wins for your site
3 Quick accessibility wins for your site3 Quick accessibility wins for your site
3 Quick accessibility wins for your site
 
Mystery of Alexa and ways to Increase your Alexa Ranking
Mystery of Alexa and ways to Increase your Alexa RankingMystery of Alexa and ways to Increase your Alexa Ranking
Mystery of Alexa and ways to Increase your Alexa Ranking
 
automatisering
automatiseringautomatisering
automatisering
 
Intro to developing for @twitterapi (updated)
Intro to developing for @twitterapi (updated)Intro to developing for @twitterapi (updated)
Intro to developing for @twitterapi (updated)
 
What's happening here?
What's happening here?What's happening here?
What's happening here?
 
Intro to developing for @twitterapi
Intro to developing for @twitterapiIntro to developing for @twitterapi
Intro to developing for @twitterapi
 
Consuming & embedding external content in WordPress
Consuming & embedding external content in WordPressConsuming & embedding external content in WordPress
Consuming & embedding external content in WordPress
 
Hack a Facebook password
Hack a Facebook passwordHack a Facebook password
Hack a Facebook password
 
The Good, The Bad & The Spammy IONsearch 2012
The Good, The Bad & The Spammy IONsearch 2012The Good, The Bad & The Spammy IONsearch 2012
The Good, The Bad & The Spammy IONsearch 2012
 

Similar to OAuth2 in simple words

Using ArcGIS with OAuth 2.0 - Esri DevSummit Dubai 2013
Using ArcGIS with OAuth 2.0 - Esri DevSummit Dubai 2013Using ArcGIS with OAuth 2.0 - Esri DevSummit Dubai 2013
Using ArcGIS with OAuth 2.0 - Esri DevSummit Dubai 2013
Aaron Parecki
 
Import google contacts with php or javascript using google contacts api and o...
Import google contacts with php or javascript using google contacts api and o...Import google contacts with php or javascript using google contacts api and o...
Import google contacts with php or javascript using google contacts api and o...
Design 19
 
OAuth Introduction
OAuth IntroductionOAuth Introduction
OAuth Introduction
h_marvin
 

Similar to OAuth2 in simple words (20)

OAuth and Open-id
OAuth and Open-idOAuth and Open-id
OAuth and Open-id
 
Stateless authentication for microservices - GR8Conf 2015
Stateless authentication for microservices - GR8Conf 2015Stateless authentication for microservices - GR8Conf 2015
Stateless authentication for microservices - GR8Conf 2015
 
Stateless authentication for microservices - Greach 2015
Stateless authentication for microservices - Greach 2015Stateless authentication for microservices - Greach 2015
Stateless authentication for microservices - Greach 2015
 
Stateless authentication for microservices - Spring I/O 2015
Stateless authentication for microservices  - Spring I/O 2015Stateless authentication for microservices  - Spring I/O 2015
Stateless authentication for microservices - Spring I/O 2015
 
Using ArcGIS with OAuth 2.0 - Esri DevSummit Dubai 2013
Using ArcGIS with OAuth 2.0 - Esri DevSummit Dubai 2013Using ArcGIS with OAuth 2.0 - Esri DevSummit Dubai 2013
Using ArcGIS with OAuth 2.0 - Esri DevSummit Dubai 2013
 
Import google contacts with php or javascript using google contacts api and o...
Import google contacts with php or javascript using google contacts api and o...Import google contacts with php or javascript using google contacts api and o...
Import google contacts with php or javascript using google contacts api and o...
 
OAuth Introduction
OAuth IntroductionOAuth Introduction
OAuth Introduction
 
Securing APIs with OAuth 2.0
Securing APIs with OAuth 2.0Securing APIs with OAuth 2.0
Securing APIs with OAuth 2.0
 
Devteach 2017 OAuth and Open id connect demystified
Devteach 2017 OAuth and Open id connect demystifiedDevteach 2017 OAuth and Open id connect demystified
Devteach 2017 OAuth and Open id connect demystified
 
OAuth in the Wild
OAuth in the WildOAuth in the Wild
OAuth in the Wild
 
UC2013 Speed Geeking: Intro to OAuth2
UC2013 Speed Geeking: Intro to OAuth2UC2013 Speed Geeking: Intro to OAuth2
UC2013 Speed Geeking: Intro to OAuth2
 
Introduction to OAuth 2.0 - the technology you need but never really learned
Introduction to OAuth 2.0 - the technology you need but never really learnedIntroduction to OAuth 2.0 - the technology you need but never really learned
Introduction to OAuth 2.0 - the technology you need but never really learned
 
An Introduction to OAuth 2
An Introduction to OAuth 2An Introduction to OAuth 2
An Introduction to OAuth 2
 
Stateless Auth using OAuth2 & JWT
Stateless Auth using OAuth2 & JWTStateless Auth using OAuth2 & JWT
Stateless Auth using OAuth2 & JWT
 
Introduction to OAuth
Introduction to OAuthIntroduction to OAuth
Introduction to OAuth
 
Stateless Auth using OAUTH2 & JWT
Stateless Auth using OAUTH2 & JWTStateless Auth using OAUTH2 & JWT
Stateless Auth using OAUTH2 & JWT
 
Stateless authentication for microservices applications - JavaLand 2015
Stateless authentication for microservices applications -  JavaLand 2015Stateless authentication for microservices applications -  JavaLand 2015
Stateless authentication for microservices applications - JavaLand 2015
 
Integrating OAuth and Social Login Into Wordpress
Integrating OAuth and Social Login Into WordpressIntegrating OAuth and Social Login Into Wordpress
Integrating OAuth and Social Login Into Wordpress
 
What the Heck is OAuth and OIDC - UberConf 2018
What the Heck is OAuth and OIDC - UberConf 2018What the Heck is OAuth and OIDC - UberConf 2018
What the Heck is OAuth and OIDC - UberConf 2018
 
Facebook + Ruby
Facebook + RubyFacebook + Ruby
Facebook + Ruby
 

Recently uploaded

+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
?#DUbAI#??##{{(☎️+971_581248768%)**%*]'#abortion pills for sale in dubai@
 
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Safe Software
 

Recently uploaded (20)

presentation ICT roal in 21st century education
presentation ICT roal in 21st century educationpresentation ICT roal in 21st century education
presentation ICT roal in 21st century education
 
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
 
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemkeProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
 
DEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
DEV meet-up UiPath Document Understanding May 7 2024 AmsterdamDEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
DEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
 
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost SavingRepurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
 
Cyberprint. Dark Pink Apt Group [EN].pdf
Cyberprint. Dark Pink Apt Group [EN].pdfCyberprint. Dark Pink Apt Group [EN].pdf
Cyberprint. Dark Pink Apt Group [EN].pdf
 
Manulife - Insurer Transformation Award 2024
Manulife - Insurer Transformation Award 2024Manulife - Insurer Transformation Award 2024
Manulife - Insurer Transformation Award 2024
 
2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...
 
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
 
Exploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone ProcessorsExploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone Processors
 
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
 
"I see eyes in my soup": How Delivery Hero implemented the safety system for ...
"I see eyes in my soup": How Delivery Hero implemented the safety system for ..."I see eyes in my soup": How Delivery Hero implemented the safety system for ...
"I see eyes in my soup": How Delivery Hero implemented the safety system for ...
 
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
 
Ransomware_Q4_2023. The report. [EN].pdf
Ransomware_Q4_2023. The report. [EN].pdfRansomware_Q4_2023. The report. [EN].pdf
Ransomware_Q4_2023. The report. [EN].pdf
 
Corporate and higher education May webinar.pptx
Corporate and higher education May webinar.pptxCorporate and higher education May webinar.pptx
Corporate and higher education May webinar.pptx
 
Emergent Methods: Multi-lingual narrative tracking in the news - real-time ex...
Emergent Methods: Multi-lingual narrative tracking in the news - real-time ex...Emergent Methods: Multi-lingual narrative tracking in the news - real-time ex...
Emergent Methods: Multi-lingual narrative tracking in the news - real-time ex...
 
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWEREMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
 
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot TakeoffStrategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
 
AXA XL - Insurer Innovation Award Americas 2024
AXA XL - Insurer Innovation Award Americas 2024AXA XL - Insurer Innovation Award Americas 2024
AXA XL - Insurer Innovation Award Americas 2024
 
AWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of TerraformAWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of Terraform
 

OAuth2 in simple words

  • 1. OAuth2 Kent Tong, TipTec Development © 2018
  • 2. OAuth2: Using your Google or Facebook account with other web apps
  • 3. Redirecting the user to authentication server Your web app Browser Google Redirect to: https://auth.google.com http://localhost/myapp https://auth.google.com https://auth.google.com Redirect the user to Google, Facebook, etc.
  • 4. User logging in and granting permission to the app Google Grant permission to app 123? Browser OK Your web app http://localhost/myapp Redirect to: http://localhost/myapp/resume? access_token=abc Using the access token, the web app can do things as the user. Redirect the browser to the web app. ... access_token=abc
  • 5. But wait! Google Grant permission to app 123? Browser OK Your web app http://localhost/myapp Redirect to: http://localhost/myapp/resume? access_token=abc How does Google know the URL of your web app? How does Google know the name of your web app (app 123)?
  • 6. Your web app needs to tell Google its name & resume URL at the beginning Your web app Browser Google Redirect to: https://auth.google.com ? client_id=app123& redirect_url=http://localhost/myapp/resume http://localhost/myapp https://auth.google.com ? client_id=...& redirect_url=... Your web app provides its name and resume URL to Google via the browser.
  • 7. User logging in and granting permission to the app Google https://auth.google.com Grant permission to app 123? Browser OK Your web app http://localhost/myapp Redirect to: http://localhost/myapp/resume? access_token=abc ... access_token=abc
  • 8. Acting as the user to do things (e.g., retrieve his profile info) Google https://profile.google.com Your web app https://profile.google.com? clientId=app123& access_token=abc { "user_name":"kent", ... } May be a dedicated server for retrieving user profile.
  • 9. However, the token is for the web app but handed to the browser Google Grant permission to app 123? Browser OK Redirect to: http://localhost/myapp/resume? access_token=abc If the browser has been hacked, the hacker can use the access token and pretend to be your web app. Your web app ... access_token=abc
  • 10. Sending an authorization code instead of the access token Google Grant permission to app 123? Browser OK Your web app Redirect to: http://localhost/myapp/resume? code=xyz ...?code=xyz
  • 11. The authorization code CANNOT be used to do things as the user Google https://profile.google.com Browser or hacker https://profile.google.com? clientId=app123& access_token=xyz "invalid access token"
  • 12. The app can get an access token with the authorization code Google https://token.google.com Grant permission to app 123? Browser OK Your web app ...?code=xyz https://token.google.com? client_id=app123& client_secret=aaa code=xyz { "access_token":"abc", ... } Google Only the web app and Google know this client secret. Allow? Redirect. May be a dedicated server for getting an access token.
  • 13. Acting as the user to do things Google https://profile.google.com Your web app http://localhost/myapp https://profile.google.com? clientId=app123& access_token=abc { "user_name":"kent", ... }
  • 14. The app wants everything or just simple things like email? Your web app Browser Google Redirect to: https://auth.google.com? client_id=app123& scope=public_info& redirect_url=http://localhost/myapp/resume https://auth.google.comhttps://auth.google.com? client_id=app123& scope=public_info& ... The available scope values and meanings are decided by the auth server.
  • 15. app wants everything or just simple things like email? Google https://auth.google.com Grant permission to read your public info to app 123? Browser OK Your web app Redirect