Login with X

fanglansheng
Aug 9, 2017 · 3 min read

Prerequisites:

You may hear a lot about OpenID, OAuth2 and OpenID Connect, check this stack overflow post for details about the difference. Here is the summary:

  • OpenID is about authentication
  • OAuth is about authorization (OAuth 2.0 is the industry-standard protocol for authorization)
  • OpenID Connect is in fact OAuth (an authorization protocol) which is turned (abused) into an authentication protocol.
    OpenID Connect = authentication + authorization;
    But OpenID Connect != OpenID + OAuth.
    (It is a simple identity layer on top of the OAuth 2.0 [RFC6749] protocol. It enables Clients to verify the identity of the End-User based on the authentication performed by an Authorization Server, as well as to obtain basic profile information about the End-User in an interoperable and REST-like manner.)

Authentication and Authorization

When you login in Spotify with your Google account, you will go through these 3 steps:

0. When you click “login with google” button, Spotify redirect you to Google (the third party) login page.
1. Then you put in your email and password
2. Allow the Spotify to access your google account information
3. Redirect back to Spotify page.

The step 1 is authentication, it proves you have google account. The step 2 is authorization. You grant Spotify right to access your information.

Authentication(认证) is to prove who you are

  • the authentication request result is to get a id_token(in authentication response)
  • response_type: id_token
  • id_token is a JWT(Json web token)

Authorization(授权) is to tell the web app what it can do

  • response: get a ‘code’ => authorization code
  • response_type: code or token

The OpenID Connect Flow

  1. The RP (Client, your app) sends a request to the OpenID Provider (OP, take Google as esample).
  2. The OP authenticates the End-User(people who provide the password and accound) and obtains authorization.
  3. The OP responds with an ID Token and usually an Access Token.
  4. The RP can send a request with the Access Token to the UserInfo Endpoint.
  5. The UserInfo Endpoint returns Claims about the End-User.

The authentication flows determine how the ID Token and Access Token are returned to the Client (Step 3). There are three types:

  • Authorization Code Flow (use in server side) : OAuth 2.0 flow in which an Authorization Code is returned from the Authorization Endpoint and all tokens are returned from the Token Endpoint.
  • Implicit Flow (use in front end): OAuth 2.0 flow in which all tokens are returned from the Authorization Endpoint and neither the Token Endpoint nor an Authorization Code are used.
    (The difference between Implicit Flow and Authorization Code Flow: https://stackoverflow.com/questions/13387698/why-is-there-an-authorization-code-flow-in-oauth2-when-implicit-flow-works-s)
  • Hybrid Flow: OAuth 2.0 flow in which an Authorization Code is returned from the Authorization Endpoint, some tokens are returned from the Authorization Endpoint, and others are returned from the Token Endpoint.

The flow is determined by response_type:

Example:
Check here for more details

Authorization code flow request:
GET /authorize?
response_type=code
&scope=openid%20profile%20email
&client_id=s6BhdRkqt3
&state=af0ifjsldkj
&redirect_uri=https%3A%2F%2Fclient.example.org%2Fcb
Successful authentication response:
HTTP/1.1 302 Found
Location: https://client.example.org/cb?
code=SplxlOBeZQQYbYS6WxSbIA
&state=af0ifjsldkj

Libraries you can use:

OAuth2: https://oauth.net/code/
OpenID Connect: http://openid.net/developers/libraries/

I used https://github.com/litl/rauth (client library for OAuth2) for my flask app. Here is an tutorial: OAuth Authentication with Flask

Other references:

Google OpenID Connect: https://developers.google.com/identity/protocols/OpenIDConnect

Google OAuth 2: https://developers.google.com/identity/protocols/OAuth2

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade