How to set up firebase Authentication (with ```twitter_login: ^4.0.1``` and ```flutter_facebook_auth: ^4.0.1``` respectively) in Flutter?

Question

Firebase Authentication (with twitter_login: ^4.0.1 and flutter_facebook_auth: ^4.0.1 respectively) in Flutter. I am getting errors in both the Authentication processes. I had also setup in Facebook Login and Twitter Login in developer account. Also went through many articles online but it seems none were working. After the recent updates.

error Message Received:

E/com.facebook.GraphResponse(13052): {HttpStatus: 400, errorCode: 100, subErrorCode: 33, errorType: GraphMethodException, errorMessage: Unsupported get request. Object with ID 'XXXXXXXXXXXX' does not exist, cannot be loaded due to missing permissions, or does not support this operation. Please read the Graph API documentation at https://developers.facebook.com/docs/graph-api}

The above message was from Facebook the below from Twitter

E/flutter (13052): [ERROR:flutter/lib/ui/ui_dart_state.cc(209)] Unhandled Exception: PlatformException(400, Failed to generate request token., Please check your APIKey or APISecret., null)

AndroidManifest.xmlfile.

<meta-data android:name="com.facebook.sdk.ApplicationId"
            android:value="@string/facebook_app_id"/>

         <activity android:name="com.facebook.FacebookActivity"
            android:configChanges=
               "keyboard|keyboardHidden|screenLayout|screenSize|orientation"
            android:label="@string/app_name" />
         <activity
            android:name="com.facebook.CustomTabActivity"
            android:exported="true">
             <intent-filter>
                <action android:name="android.intent.action.VIEW" />
                <category android:name="android.intent.category.DEFAULT" />
                <category android:name="android.intent.category.BROWSABLE" />
                 <data android:scheme="@string/fb_login_protocol_scheme" />
             </intent-filter>
             <intent-filter>
                 <action android:name="android.intent.action.VIEW" />
                 <category android:name="android.intent.category.DEFAULT" />
                 <category android:name="android.intent.category.BROWSABLE" />
                 <action android:name="android.intent.action.MAIN"/>
                 <category android:name="android.intent.category.LAUNCHER"/>
                 <data android:scheme="twitter-firebase-auth"/>
             </intent-filter>
         </activity>

pubspec.yaml packages,

flutter_facebook_auth: 4.0.0
twitter_login: 4.0.1
firebase_auth: 3.3.5
firebase_core: 1.11.0

Facebook Sign-In:

import 'package:firebase_auth/firebase_auth.dart';
import 'package:flutter/foundation.dart';
import 'package:flutter_facebook_auth/flutter_facebook_auth.dart';


var title = "";
var displayName = "";
FirebaseAuth auth = FirebaseAuth.instance;

signInWithFacebook() async {
  try {
    final LoginResult result = await FacebookAuth.instance.login();
    switch (result.status) {
      case LoginStatus.success:
        final AuthCredential credential =
        FacebookAuthProvider.credential(result.accessToken!.token);
        if (kDebugMode) {
          print(result.accessToken!.token);
        }
        final userCredential = await auth.signInWithCredential(credential);
        if (kDebugMode) {
          print(credential.signInMethod);
        }
        // TODO: Store user.credential!.signInMethod in SharedPref.
        if (kDebugMode) {
          print(userCredential.user!.displayName);
        }
        // boolean isLoggedIn = accessToken != null && !accessToken.isExpired();
        if (kDebugMode) {
          print("status: Status.Success");
        }
        break;
      case LoginStatus.cancelled:
        if (kDebugMode) {
          print("status: Status.Cancelled");
        }
        break;
      case LoginStatus.failed:
        if (kDebugMode) {
          print("status: Status.Failed");
        }
        break;
      default:
        if (kDebugMode) {
          print("null");
        }
        break;
    }
  } catch (e) {
    if (kDebugMode) {
      print('Error occurred!' + e.toString());
    }
  }
}

Twitter Sign-In

import 'package:firebase_auth/firebase_auth.dart';
import 'package:flutter/foundation.dart';
import 'package:twitter_login/twitter_login.dart';

FirebaseAuth _auth = FirebaseAuth.instance;

signInWithTwitter() async {
  final twitterLogin = TwitterLogin(
    apiKey: "XXXXXXXXXXXXXX",
    apiSecretKey: "XXXXXXXXXXXXXXXXXXXX",
    redirectURI: "twitter-firebase-auth://",
  );
  final authResult = await twitterLogin.login();

  switch (authResult.status) {
    case TwitterLoginStatus.loggedIn:
      if (kDebugMode) {
        print("status: LogIn Success");
      }
      final AuthCredential twitterAuthCredential =
          TwitterAuthProvider.credential(
              accessToken: authResult.authToken!,
              secret: authResult.authTokenSecret!);

      final userCredential =
          await _auth.signInWithCredential(twitterAuthCredential);
      if (kDebugMode) {
        print("status: SignIn With Credential Success");
      }
      break;
    case TwitterLoginStatus.cancelledByUser:
      if (kDebugMode) {
        print("status: Cancelled By User");
      }
      break;
    case TwitterLoginStatus.error:
      if (kDebugMode) {
        print("status: Error");
      }
      break;
    default:
      if (kDebugMode) {
        print("status: null");
      }
  }
}

Answer 1

Problem Solved,

Twitter Solution:

(Went through twitter_login: ^4.0.1 documentation).

<data android:scheme="flutter-twitter-auth"/>

Replace the above with,

<data android:scheme="your_app_name"/>

also replace the below snippet

final twitterLogin = TwitterLogin(
      apiKey: "xxxxxxxxxx",
      apiSecretKey: "xxxxxxxxx",
      redirectURI: 'flutter-twitter-auth://',
    );

with

final twitterLogin = TwitterLogin(
      apiKey: "xxxxxxxxxx",
      apiSecretKey: "xxxxxxxxx",
      redirectURI: 'your_app_name://',
    );

and finally callback URL in twitter developer account should be,

your_app_name://

Changed XML file:

<meta-data android:name="com.facebook.sdk.ApplicationId"
            android:value="@string/facebook_app_id"/>

         <activity android:name="com.facebook.FacebookActivity"
            android:configChanges=
               "keyboard|keyboardHidden|screenLayout|screenSize|orientation"
            android:label="@string/app_name" />
         <activity
            android:name="com.facebook.CustomTabActivity"
            android:exported="true">
             <intent-filter>
                <action android:name="android.intent.action.VIEW" />
                <category android:name="android.intent.category.DEFAULT" />
                <category android:name="android.intent.category.BROWSABLE" />
                 <data android:scheme="@string/fb_login_protocol_scheme" />
             </intent-filter>
             <intent-filter>
                 <action android:name="android.intent.action.VIEW" />
                 <category android:name="android.intent.category.DEFAULT" />
                 <category android:name="android.intent.category.BROWSABLE" />
                 <action android:name="android.intent.action.MAIN"/>
                 <category android:name="android.intent.category.LAUNCHER"/>
                 <data android:scheme="twitter-firebase-auth"/>
             </intent-filter>
         </activity>

as shown below:

             <meta-data
              android:name="io.flutter.embedding.android.NormalTheme"
              android:resource="@style/NormalTheme"
              />
            <intent-filter>
                <action android:name="android.intent.action.MAIN"/>
                <category android:name="android.intent.category.LAUNCHER"/>
            </intent-filter>
            <intent-filter>
                <action android:name="android.intent.action.VIEW" />
                <category android:name="android.intent.category.DEFAULT" />
                <category android:name="android.intent.category.BROWSABLE" />
                <data android:scheme="buildyourenglish"/>
            </intent-filter>
         <meta-data android:name="com.facebook.sdk.ApplicationId"
            android:value="@string/facebook_app_id"/>

         <activity android:name="com.facebook.FacebookActivity"
            android:configChanges=
               "keyboard|keyboardHidden|screenLayout|screenSize|orientation"
            android:label="@string/app_name" />
         <activity
            android:name="com.facebook.CustomTabActivity"
            android:exported="true">
             <intent-filter>
                <action android:name="android.intent.action.VIEW" />
                <category android:name="android.intent.category.DEFAULT" />
                <category android:name="android.intent.category.BROWSABLE" />
                 <data android:scheme="@string/fb_login_protocol_scheme" />
             </intent-filter>
             
         </activity>

Facebook Solution:

Get the client token as shown below:

App Dashboard -> Settings -> Advanced -> Security -> Client_Token (Your facebook client token)

Go to Project_Folder -> android -> app -> src -> main -> res -> values -> value.xml (create if not existing) and paste the below code.

Similarly, Go to Project_Folder -> android -> app -> src -> main -> res -> values -> value.xml (create if not existing) and paste the below code.

<?xml version="1.0" encoding="utf-8"?>

<resources>
    <string name="app_name">your_app_name</string>
    <string name="facebook_app_id">your_facebook_app_id</string>
    <string name="fb_login_protocol_scheme">your_fb_login_protocol_scheme (fb+your_facebook_app_id)</string>
    <string name="facebook_client_token">your_facebook_client_token</string>
</resources>

And also generate Hash Key from the below link:

http://tomeko.net/online_tools/hex_to_base64.php 

Have to give SHA1: as input. (courtesy tomeko.net and stackoverflow.com)