So You Want Social Login (OAuth 2.0) With Flutter…

A d̶e̶f̶i̶n̶i̶t̶i̶v̶e̶ quick and easy guide.

Photo by Austin Chan on Unsplash

I know why you’re here. You are building, or plan on building, an app, and it’s going to be the greatest thing since peanut butter. You’ve chosen Flutter because you have eyes for the future and React Native just won’t cut it in 2021. You sat down at your machine, big smile on your face, ready to change the world. But first, how do you implement social login? You looked around the web for a c̶o̶m̶p̶r̶e̶h̶e̶n̶s̶i̶v̶e quick and easy solution and you didn’t find one. What you found was a handful of libraries for specific platforms, and, quite frankly, they were neither quick nor easy. Yes, I know what you’re thinking. No, I’m not psychic. I know these things because, I was you.

I learned something from someone, sometime ago: keep simple things simple. That’s right. It’s the guiding principle behind every line of code I write. After unsuccessfully scouring the web for a viable solution, it became clear that this had to be a custom job. The goal was simple: create something that makes authentication with OAuth 2.0 as simple as possible in Flutter. After building this functionality into my app, I decided to pull it into its own package and share it with the community. The beauty of open source.

Let’s get to it then. The library is called visa (a little nod to Jared Hansen’s passport). It sets up a webview for authentication with the proper platform and returns all relevant OAuth data, including the access token. Here’s how you would authenticate a user through Facebook:

Sample Run:

This is what I was looking for when I scoured the web for a solution all those months ago: quick and easy. The example shows how you would implement Facebook login but the same pattern applies to all supported platforms. They all implement the same interface. The…