Saturday, November 30, 2013

OAuth for dummies - Illustrating OAuth for User Joe

Disclaimer, this is not a training dot, but it's my attempt to understand OAuth in Plain English or with visual aids. Any suggestions are welcome. See this as published personal notes.

Thoughtworks gave an awesome overview:
 "OAuth is an open-source specification for building a framework for allowing a third-party app (the “client”) to access protected resources from another application (the “provider,” or “resource owner”) at the request of a “user” of the client app. Oauth allows the user to enter his user credentials (ex. username and password) only to the provider app, which then grants the client app permission to view the protected resources on behalf of the user."

There are a few "players" here.
The third-party app: say a newly launched startup app in beta, Facebook for dating F-Book
The user: you, an aspiring bachelor with a dream
The provider: Facebook, which has your profile, and friend list

When you want to log onto F-Book for the first time, you don't want to give an untested app all your favorite password. You saw the option to use Facebook login instead.

You choose that. A familiar blue popup shows up and ask for your Facebook username and password. Hooray, you do this everyday.

Click login. The popup disappears, you are directed to F-Book, which now has your profile picture, your friend list (tells you which friends already joined), and you can now start to use F-Book! Voila.

Actually there was another step after you used Facebook credentials to sign in: Facebook asks you are you sure you want to grant profile and friend list access to F-Book. You say okay or skip. If you skip, you likely will get a 404 from F-Book (oops, something went wrong). If you grant, then Facebook secretly sends a token over to F-Book and was like okay F-Book, you can now communicate with me. Remember to send over this token, when you want to retrieve information about this particular user. Remember to send over your app API token too, because I want to know you are F-Book for reals, not knockoff-FBook.

Now F-Book can use APIs like getUserProfilePic() getUserFriendList(), Facebook pukes out a JSON, everyone's happy.

Of course, this isn't quite how it works but you get the idea. I have grossly admitted important details about security and how secret and public keys work. I wrote this post because every time someone asks me about OAuth, my initial thought is always that I know nothing. But the reality is, since it has been popularly adopted all over the place, I have seen many manifestations of OAuth: Twitter, Facebook logins, Google Plus logins, GitHub (SSH secret keys), Yahoo YQL, Google Map.

No comments:

Post a Comment

React UI, UI UX, Reactstrap React Bootstrap

React UI MATERIAL  Install yarn add @material-ui/icons Reactstrap FORMS. Controlled Forms. Uncontrolled Forms.  Columns, grid