The OAuth Playground is an application/tool by Google for learning how OAuth works. It presents you with a three-step process for selecting the services you want to authorize, generating an access token, and making API requests.
In OAuth terminologies, Google OAuth playground will act as a client Application which does contain client id, Client secret and OAuth Endpoints required to access Service provider.
It also supports custom endpoints as well i.e. using Google OAuth playground you can connect to another service provider as well apart from Google like Salesforce.
Resource Owner: You
Client Application: Google OAuth 2.0 Playground
Service Provider: Google
Client Application: Google OAuth 2.0 Playground
Service Provider: Google
In this blog, I’ll only focus on Google API and will try to retrieve user profile via playground.
Step 1: Hit https://developers.google.com/oauthplayground/
Step 2: You will see a list of scope using which you can access particular resources. As our aim is to fetch user profile so will scroll down and select https://www.googleapis.com/auth/userinfo.profile from Google People API v1 scope.
Step 3: Click on Authorize APIs button and If you are not logged into google then it will ask for your user credentials and after successful authentication, it will show the authorization consent page. Click on Accept button.
Step 4: Now we have the Authorization Code but if you check Request/Response section then you will notice that playground application hits AUTHORIZATION ENDPOINTS
Authorization request:
We hit this request to the
authorization endpoint to obtain an authorization code
https://accounts.google.com/o/oauth2/v2/auth?redirect_uri=https%3A%2F%2Fdevelopers.google.com%2Foauthplayground&prompt=consent&response_type=code&client_id=407408718192.apps.googleusercontent.com&scope=https%3A%2F%2Fwww.googleapis.com%2Fauth%2Fuserinfo.profile&access_type=offline
where
response_type ->
it always should be code, specifies that request is sent to the
authorization endpoint to obtain an authorization code. ( Required)
client_id ->
The Id issued to this application by Authorization server at the time of registration.
(Required)
redirect_uri
-> URI registered on the authorization server as a RedirectURI or callback
URL.
Scope -> Access scope of the request
and after successful authentication and authorization, Playground is getting the Authorization Code on its registered redirect URL.
Authorization response:
It contains the Auth code in exchange
of which we will get the access token.
/oauthplayground/?code=4%2F0pGBATfaL6OoBr4qotf_W6FrCnTiCR7Bidd7BgaWenU
where
code -> Authorization code (Required)
Step 5: To get the access token, Click on Exchange authorization code for tokens button and you will get the access and refresh token.
Check Request/Response section, Playground hits TOKEN ENDPOINTS to get the access token.
Token request:
We hit token
endpoint to obtain an access token by exchanging the Auth code.
code=4%2F4by6pl_Bc22NnjpiCMvqrW4R2SL4oI7OjioWBHqWrD0&redirect_uri=https%3A%2F%2Fdevelopers.google.com%2Foauthplayground&client_id=407408718192.apps.googleusercontent.com&client_secret=************&scope=&grant_type=authorization_code
where
client_id
-> The Id issued to this application by Authorization server at the time of
registration. (Required)
client_secret
-> The key secret issued to this application by Authorization server at the
time of registration. (Required)
Grant_type
-> Must be set to authorization_code. (Required)
Code -> The
Authorization code received by the Authorization server.
(Required)
redirect_uri
-> URI registered on the authorization server as a RedirectURI or callback
URL. (Required)
Token Response:
The token response contains an access
token along with other information in a JSON format.
{
"access_token": "ya29.GlvMBFEQ8efg2id-lwfWJJIZl0_7rlCRyCKVWvv3v_cXIUlnYXVn6D04nUEIh9AFB65pdZcfms5TaDz692-2hmadFg0o6R1X7hdYUKuFwA9v2NvXqiLwOIFpUJlV",
"token_type": "Bearer",
"expires_in": 3600,
"refresh_token": "1/KVEh2UxFjMt5zynnbm9qajpnkDsREQTA3kldrAvcqKQ",
"id_token": "eyJhbGciOiJSUzI1NiIsImtpZCI6IjhiNmE3ZDhhM2I0NTQ4YWU1MjBmZDJkMTY2ZWEzN2U2ZGRjY2JkOWYifQ.eyJhenAiOiI0MDc0MDg3MTgxOTIuYXBwcy5nb29nbGV1c2VyY29udGVudC5jb20iLCJhdWQiOiI0MDc0MDg3MTgxOTIuYXBwcy5nb29nbGV1c2VyY29udGVudC5jb20iLCJzdWIiOiIxMDUyOTA1MTEwNTU1NTA4NjY0ODciLCJhdF9oYXNoIjoiODVIUHJYSnZiWTNmN0FTOEg2VjBYZyIsImlzcyI6Imh0dHBzOi8vYWNjb3VudHMuZ29vZ2xlLmNvbSIsImlhdCI6MTUwNTkwNzc3MCwiZXhwIjoxNTA1OTExMzcwLCJuYW1lIjoiYWJkdWwgd2FoZWVkIiwicGljdHVyZSI6Imh0dHBzOi8vbGgzLmdvb2dsZXVzZXJjb250ZW50LmNvbS8tcDRVaEFJTUNkWkUvQUFBQUFBQUFBQUkvQUFBQUFBQUFCQ0UvTy1YUnEyUFVhYW8vczk2LWMvcGhvdG8uanBnIiwiZ2l2ZW5fbmFtZSI6ImFiZHVsIiwiZmFtaWx5X25hbWUiOiJ3YWhlZWQiLCJsb2NhbGUiOiJlbi1HQiJ9.sS2Du_uR0Y-Sr2BlxBkbYSbzNfXDLy_Baj1ZbX21x-tWUHTe5R9v9ZR8S7gwfmVjAPAjHm-ivQg4aOBzQs8U9YmCei2tg1vLFTg51KsTWXK6u4WEbgHQQaPOORAfeKrZtKaUjvQgTKy007Dqdv_nzT6dt9b-vezTDLHX-fV9lx-k_-ApD9BKdrBjsqx8tAJ1cC_vg4NY_M--6ztYSf8xKG_aAF296Mq_aUakVGSl2pA5n3k0SMXyJlkIaWCilz2jQjBt_Hi_zeKdezCIU4jHTr8lstyz_SV9V2nueWV7n82K2RzS3uo-PtMDUWceNRr0r6dhWh_JxXivCqH2twh9pw"
}
Where
access_token
-> token using which you can access the user details from resource server.
token_type
-> define the nature of token
expire_in
-> number of seconds after which the access token get expired.
refresh_token
-> using refresh token, we can get new access token once the above access
token is no longer valid.
Step 6: Select V2 UserInfo from list possible operations to get the user profile.
Step 7: Click on Send the request button and it will access the user profile by passing access token as authorization bearer in the headers and display it in JSON format.
Conclusion: Google playground is an amazing
tool to learn OAuth flow with Google as well as with custom application. If you
are planning to build your Authorization server then you can use it as a
testing tool as Google playground is a standard OAuth Client web application.
If you need
an idea on how can we get it done the same thing via JAVA web application then
you must check my blog over here. I have done
something similar where my Service provider is Salesforce instead of Google.