Cara Autentikasi Menggunakan Akun Twitter pada Firebase


Assalamualaikum Warahmatullahi Wabarakatuh.

Jaman sekarang ini, pengguna Twitter sangatlah banyak, tidak heran jika seorang pengembang aplikasi menggunakan menggunakan metode masuk dengan Akun Twitter, selain facebook dan google. Kita sabagai pengembang, dapat membuat sistem autentikasi dengan Twitter yang disediakan pada Firebase.


Firebase menyediakan banyak sekali method masuk untuk autentikasi, seperti facebook, email, google, github, nomor telepon, twitter, dll. Kita dapat mengizinkan pengguna untuk melakukan autentikasi melalui akun Twitter mereka, dengan mengintegrasikan autentikasi Twitter ke dalam aplikasi kita.

Materi lainnya yang direkomendasikan:

Cara Autentikasi Menggunakan Akun Twitter pada Firebase

1) Pertama-tama, kita harus menambahkan Firebase kedalam Project Aplikasi,Untuk Tutorialnya kalian bisa lihat Disini

2) Selanjutnya kita perlu mengkonfigurasi aplikasi twitter, untuk di gunakan pada project aplikasi kita, kalian buka situs web, bernama Twitter Application Management.

3) Disini kita diharuskan untuk login/sign in dengan akun Twitter kita.

Twiitter Apps Sign In

4) Klik Create New App, untuk mendaftarkan aplikasi kita sebagai developer di Twitter, untuk mendapatkan kunci API dan Secret API.

Membuat App Baru di Twitter Apps

5) Pada bagian ini kalian diminta untuk memasukan Nama, Deskripsi, Website dan Callback URL.

Memasukan Detail Aplikasi

Pada bagian website, kalian dapat memasukan web yang menginformasikan project aplikasi kalian, atau bisa dengan memasuka website probadi kalian.

Callback URL, kalian bisa mendapatkannya pada Firebase Autentukasi saat mengaktifkan metode masuk Twitter, kalian salin URL tersebut.

Mendapatkan Callback URL

6) Masuk pada bagian Keys and Access Tokens, salin API key dan API secret, lalu tempelkan pada Metode masuk Twitter didalam Firebase, setelah itu simpan.

Mendapatkan Key API

7) Pada project aplikasi kalian, buka file build.gradle (direkori app), tambahkan library autentikasi, dan sertakan juka Twitter SDK kedalam dependencies.

compile 'com.google.firebase:firebase-auth:11.8.0'
compile("com.twitter.sdk.android:twitter-core:3.0.0@aar") { transitive = true }

8) Jangan lupa untuk menambahkan kedua permission berikut ini didalam AndroidManifest.xml kalian. permission tersebut digunakan untuk mengizinkan aplikasi membuka socket jaringan.

<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
<uses-permission android:name="android.permission.INTERNET" />

Disini kita akan membuat 2 buah activity, pertama yaitu activity untuk autentikasi, dimana activity tersebut akan muncul saat pertama kali dijalankan, Kedua yaitu main activity, activity tersebut akan muncul jika user berhasil login, dan didalam activity tersebut kita terdapat Button untuk logout.

9) Buat activity baru, berinama misalnya "LoginActivity", disini kita akan menambahkan Button Login yang disediakan oleh Twitter SDK.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_margin="28dp"
    android:gravity="center"
    android:orientation="vertical"
    tools:context="cianjur.developer.net.firebaseexample.login">

    <com.twitter.sdk.android.core.identity.TwitterLoginButton
        android:id="@+id/login"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

</LinearLayout>

View:

Layout Activity Untuk Login

10) Selanjutnya kita buat activity baru, bernama "MainActivity", disini kita cukup menambahkan 1 buah Button saja.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_margin="16dp"
    android:gravity="center"
    android:orientation="vertical"
    tools:context="cianjur.developer.net.firebaseexample.main_menu">

    <Button
        android:id="@+id/logout"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Keluar" />

</LinearLayout>

11) Buka file LoginActivity.java, masukan source code berikut ini:


package cianjur.developer.net.firebaseexample;

import android.content.Intent;
import android.support.annotation.NonNull;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.util.Log;
import android.widget.Toast;

import com.google.android.gms.tasks.OnCompleteListener;
import com.google.android.gms.tasks.Task;
import com.google.firebase.auth.AuthCredential;
import com.google.firebase.auth.AuthResult;
import com.google.firebase.auth.FirebaseAuth;
import com.google.firebase.auth.TwitterAuthProvider;
import com.twitter.sdk.android.core.Callback;
import com.twitter.sdk.android.core.Result;
import com.twitter.sdk.android.core.Twitter;
import com.twitter.sdk.android.core.TwitterAuthConfig;
import com.twitter.sdk.android.core.TwitterConfig;
import com.twitter.sdk.android.core.TwitterException;
import com.twitter.sdk.android.core.TwitterSession;
import com.twitter.sdk.android.core.identity.TwitterLoginButton;

public class login extends AppCompatActivity{

    //Deklarasi Variable
    private FirebaseAuth firebaseAuth; //Untuk Autentifikasi
    private FirebaseAuth.AuthStateListener authStateListener; //Untuk Menangani Kajadian Saat Autentifikasi
    private TwitterLoginButton loginButton;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_login);

        //Konfigurasi Twitter SDK
        //Masukan Key API dan Secret API
        TwitterAuthConfig authConfig = new TwitterAuthConfig("NWyeZKmQY4LmCbAzMtFAyWyJX",
                         "aiBPbYtBybumYbcAeheIzDAvxxKRObRpGwh8ac8Nd6UH9AJSSy");
        TwitterConfig twitterConfig = new TwitterConfig.Builder(this)
                .twitterAuthConfig(authConfig)
                .build();
        Twitter.initialize(twitterConfig);

        loginButton = findViewById(R.id.login);
        loginButton.setEnabled(true);
        loginButton.setCallback(new Callback() {
            @Override
            public void success(Result result) {
                handleTwitterSession(result.data);
            }

            @Override
            public void failure(TwitterException exception) {
                Toast.makeText(getApplicationContext(), "Autentikasi Dihentikan", Toast.LENGTH_SHORT).show();
            }
        });

        FirebaseConnect();
    }

    private void FirebaseConnect(){
        firebaseAuth = FirebaseAuth.getInstance(); //Mendapatkan Instance dari Firebase Auth

        //Authentifikasi Listener
        authStateListener = new FirebaseAuth.AuthStateListener() {
            @Override
            public void onAuthStateChanged(@NonNull FirebaseAuth firebaseAuth) {
                /*
                 * Jika User sebelumnya telah masuk/login dan belum keluar/logout, secara otomatis
                 * Saat aplikasi dibuka kembali, Activity ini akan langsung dialihkan pada Activiy MainActivity
                 */
                if(firebaseAuth.getCurrentUser() != null){
                    startActivity(new Intent(login.this,MainActivity.class));
                    finish();
                }
            }
        };
    }

    //Untuk Mengangani Kejadian Saat Pengguna Berhasil Login
    private void handleTwitterSession(TwitterSession session) {
        Log.d("LoginActivity", "handleTwitterSession:" + session);

        AuthCredential credential = TwitterAuthProvider.getCredential(
                session.getAuthToken().token,
                session.getAuthToken().secret);

        firebaseAuth.signInWithCredential(credential)
                .addOnCompleteListener(this, new OnCompleteListener() {
                    @Override
                    public void onComplete(@NonNull Task task) {
                        if (task.isSuccessful()) {
                            // Saat User berhasil login/autentikasi
                            Toast.makeText(getApplicationContext(), "Autentikasi Berhasil", Toast.LENGTH_SHORT).show();
                        } else {
                            // Jika user gagal untuk autentikasi
                            Log.d("LoginActivity","signInWithCredential:failure", task.getException());
                            Toast.makeText(getApplicationContext(), "Autentikasi Gagal", Toast.LENGTH_SHORT).show();
                        }
                    }
                });
    }


    @Override
    protected void onStart() {
        super.onStart();
        //Jika User Telah Masuk/Login, makan akan mengangani kajadian apakah user telah masuk
        firebaseAuth.addAuthStateListener(authStateListener);
    }

    //Saat Aktifitas dihentikan, maka listener akan dihapus
    @Override
    protected void onStop() {
        super.onStop();
        if(authStateListener != null){
            firebaseAuth.removeAuthStateListener(authStateListener);
        }
    }

    @Override
    protected void onActivityResult(int requestCode, int resultCode, Intent data) {
        super.onActivityResult(requestCode, resultCode, data);
        loginButton.onActivityResult(requestCode, resultCode, data);
    }
}

Untuk Logout/Keluar, kalian dapat menambahkan baris kode berikut ini pada button didalam MainActivity.java:

package cianjur.developer.net.firebaseexample;

import android.content.Intent;
import android.support.annotation.NonNull;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;

import com.google.firebase.auth.FirebaseAuth;

public class MainActivity extends AppCompatActivity {

    private FirebaseAuth auth;
    private FirebaseAuth.AuthStateListener authStateListener;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        Button Keluar = findViewById(R.id.logout);
        auth = FirebaseAuth.getInstance(); //Menghubungkan dengan Firebase Authentifikasi

        //Authentifikasi Listener
        authStateListener = new FirebaseAuth.AuthStateListener() {
            @Override
            public void onAuthStateChanged(@NonNull FirebaseAuth firebaseAuth) {
                /*
                 * Jika User sebelumnya telah keluar/logout
                 * Saat aplikasi dibuka kembali, Activity ini akan langsung dialihkan pada Activity Login
                 */
                if(firebaseAuth.getCurrentUser() == null){
                    startActivity(new Intent(MainActivity.this, login.class));
                    finish();
                }
            }
        };
        Keluar.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                //Digunakan Untuk Logout
                auth.signOut();
            }
        });
    }

    @Override
    protected void onStart() {
        super.onStart();
        auth.addAuthStateListener(authStateListener);
    }

    @Override
    protected void onStop() {
        super.onStop();
        if(authStateListener != null){
            auth.removeAuthStateListener(authStateListener);
        }
    }
}

Demo:

 Screenshot_Autentikasi Dengan Facebook Example2


Untuk penjelasan lebih lanjut, kalian dapat melihat dokumentasinya disini.

Terimakasih atas kunjungannya, semoga tutorial yang saya berikan bisa bermanfaat untuk kalian semua, selebihnya, mohon maaf bila ada kesalahan.

Wassalamualaikum Warahmatullahi Wabarakatuh.

Berlangganan update artikel terbaru via email:

0 Response to "Cara Autentikasi Menggunakan Akun Twitter pada Firebase"

Posting Komentar

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel