Flutter+Firebase — Authenticate with Twitter

Etimbuk U
Etimbuk U
May 14, 2018 · 2 min read

I really got excited seeing the latest update to the Flutter Firebase Auth plugin which adds support for Twitter and decided to try it out.

firebase_auth plugin

But before we begin, I have made the following assumptions

  • Flutter has been installed on your computer. If in need of help the Flutter team have detailed step-by-step articles on how to get this done.
  • Created a Twitter app. For more details visit Twitters app page
  • You have created a firebase project with support for both Android and iOS. If in need of help this article explains the steps.
  • Enabled Twitter authentication for your Firebase project. You can do this by following step 5 of Before you begin section here
  • Downloaded and added both GoogleService-Info.plist and google-services.json files to Runner directory for iOS and android->app for Android.

final app demo (Android)

In order to achieve our purpose, the below plugins (listed in pubspec.yaml) were used

dependencies:
firebase_auth:
'^0.5.9'//we need to get a FirebaseUser
google_sign_in: '^3.0.3' //not really needed
flutter_twitter_login: "^1.1.0" //helps with Twitter OAuth dance
flutter:
sdk:
flutter

Authenticating With Twitter

First we get a TwitterLogin using flutter_twitter_login plugin

final TwitterLogin twitterLogin = new TwitterLogin(           consumerKey: Strings.twitterApiKey, 
consumerSecret: Strings.twitterApiSecret
);

Second, we get the TwitterLoginResult, TwitterLoginStatus and TwitterSession. This also using flutter_twitter_login.

_twitterLoginResult = await twitterLogin.authorize();
_currentUserTwitterSession = _twitterLoginResult.session;
_twitterLoginStatus = _twitterLoginResult.status;

We need TwitterSession to retrieve token and secret needed by FirebaseAuth.instance.signInWithTwitter(…)

Now that we have our TwitterSession, our third step will be to get a FirebaseUser provided Twitter login was successful.

AuthCredential _authCredential = TwitterAuthProvider.getCredential(
authToken: _currentUserTwitterSession?.token ?? '',
authTokenSecret: _currentUserTwitterSession?.secret ?? ''
);
_currentUser = await _firebaseAuth.signInWithCredential(
_authCredential
);

Not to worry, I did not forget our iOS friends

final app demo (iOS)

And this wraps the end of my very first post. Looking forward to the next one already 😃.

Whoops!! Here is the complete code on GitHuB.

Etimbuk U

Written by

Etimbuk U

Java | Flutter | Android | Some JavaScript | API Design

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