DEV Community

__idinabs
__idinabs

Posted on

Facebook Login Java Firebase Android Studio - Without Default Login Button

Image description


Assalamu'alaikum
Hai guys, kali ini saya akan sharing tutorial bagaiamana cara membuat authentication menggunakan facebook khususnya menggunakan bahasa pemrograman java dengan NoSql database yaitu Firebase pada android, kali ini saya akan membuat tutorial yang berbeda kali ini, yaitu bagaimana caranya membuat facebook login dengan menggunakan custom login button dan tidak akan menggunakan default login dari dependency facebooknya, oke langsung aja yah guyss dan tidak usah lama-lama.


Pertama yang perlu dilakukan itu melakukan koneksi projek android dengan firebasenya, kemudian lakukan instansiasi dan konek dengan projek firebasenya, kemudian buat baru sign methodnya menggunakan metode masuk facebook, kemudian masukan App Id serta App secret facebook developernya ke sign method facebooknya, untuk mendapatkan App id serta App Secretnya terlebih dahulu mendaftar menjadi facebook developer dan buat aplikasinya di https://developers.facebook.com, setelah buat anda perlu melakukan copy paste App Id dan App Secretnya ke sign in method facebooknya pada firebase. Dan masukan OAuth redirect URI ke facebook developernya

Image description

OAuth redirect URI

Image description


Setelah melakukan langkah diatas, langkah selanjutnya anda perlu melakukan mengaktifkan mode pengembang / Development pada facebook developernya serta membuat privacy policy aplikasinya dan kemudian masukan privacy policy ke setting > basic pada facebook developernya.

Image description

kemudian ikuti petunjuk konfigurasi selanjutnya mengenai setup facebook developer khususnya android https://developers.facebook.com/apps/316711430485618/fb-login/quickstart/


Setelah melakukan beberapa langkah diatas kemudian kita beralih ke android studionya !!!

Sebelum melakukan coding terhadapa aplikasinya perlu yang pertama dilakukan menambah dependency Authetication firebase nya.

 implementation platform('com.google.firebase:firebase-bom:29.0.4')
    implementation 'com.google.firebase:firebase-auth:21.0.1'
    implementation 'com.facebook.android:facebook-android-sdk:12.3.0'
Enter fullscreen mode Exit fullscreen mode

Lalu pada build.gradle project tambahkan syntax.

 repositories {
        mavenCentral()
    }
Enter fullscreen mode Exit fullscreen mode

Tambahkan pada baris buildscript.

Selanjutnya pada gradle.properties kita tambahkan syntax

android.useAndroidX=true
android.enableJetifier=true
Enter fullscreen mode Exit fullscreen mode

karena kita menambah dependency sdk tambahan facebook, maka penting untuk memasukan dua baris kode tersebut.


Barulah saat ini kita akan melakukan coding terhadap layout activity_main.xml facebook loginnya.

Image description

<ImageView
        android:id="@+id/fbButton"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:srcCompat="@mipmap/fblog_foreground" />

Enter fullscreen mode Exit fullscreen mode

Kemudian pada MainActivity.java

package com.rabuncode.authlog;

import androidx.appcompat.app.AppCompatActivity;

import android.content.Intent;
import android.os.Bundle;
import android.view.View;
import android.widget.ImageView;

import com.facebook.FacebookSdk;
import com.google.firebase.auth.FirebaseAuth;

public class MainActivity extends AppCompatActivity {

    ImageView btnFacebook;
    FirebaseAuth mAuth;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        FacebookSdk.sdkInitialize(getApplicationContext());

        mAuth = FirebaseAuth.getInstance();
        btnFacebook = findViewById(R.id.fbButton);
        btnFacebook.setOnClickListener(new View.OnClickListener() {

            @Override
            public void onClick(View view) {
                Intent intent = new Intent(MainActivity.this, mainMenu.class);
                intent.setFlags(Intent.FLAG_ACTIVITY_NO_ANIMATION);
                startActivity(intent);
            }
        });
    }
}
Enter fullscreen mode Exit fullscreen mode

Selanjutnya anda perlu membuat Activity baru dengan nama mainMenu (bebas loh yahh, nggak harus pakai nama itu, hehehe) karena kita intent authenticationnya pada activity mainMenu.java


Dan pada mainMenu.java tambahkan baris kode

package com.rabuncode.authlog;

import androidx.annotation.NonNull;
import androidx.appcompat.app.AppCompatActivity;

import android.content.Intent;
import android.os.Bundle;
import android.widget.Toast;

import com.facebook.AccessToken;
import com.facebook.CallbackManager;
import com.facebook.FacebookCallback;
import com.facebook.FacebookException;
import com.facebook.login.LoginManager;
import com.facebook.login.LoginResult;
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.FacebookAuthProvider;
import com.google.firebase.auth.FirebaseUser;

import java.util.Arrays;

public class mainMenu extends MainActivity {

    CallbackManager callbackManager;

    @Override
    protected void onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);

        callbackManager = CallbackManager.Factory.create();

        LoginManager.getInstance().logInWithReadPermissions(this, Arrays.asList("public_profile"));
        LoginManager.getInstance().registerCallback(callbackManager,
                new FacebookCallback<LoginResult>() {
                    @Override
                    public void onSuccess(LoginResult loginResult) {
                        Toast.makeText(mainMenu.this, "anda berhasil masuk", Toast.LENGTH_SHORT).show();
                        handleFacebookAccessToken(loginResult.getAccessToken());

                    }

                    @Override
                    public void onCancel() {
                        Toast.makeText(mainMenu.this, "anda gagal masuk sementara", Toast.LENGTH_SHORT).show();
                    }

                    @Override
                    public void onError(FacebookException exception) {
                        Toast.makeText(mainMenu.this, "anda dipaksa keluar", Toast.LENGTH_SHORT).show();
                    }
                });
    }

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

        // Pass the activity result back to the Facebook SDK
        callbackManager.onActivityResult(requestCode, resultCode, data);
    }

    private void handleFacebookAccessToken(AccessToken token) {


        AuthCredential credential = FacebookAuthProvider.getCredential(token.getToken());
        mAuth.signInWithCredential(credential)
                .addOnCompleteListener(this, new OnCompleteListener<AuthResult>() {
                    @Override
                    public void onComplete(@NonNull Task<AuthResult> task) {
                        if (task.isSuccessful()) {

                            FirebaseUser user = mAuth.getCurrentUser();
                            updateUI(user);
                        } else {
                            // If sign in fails, display a message to the user.
                            Toast.makeText(mainMenu.this, "" + task.getException(),
                                    Toast.LENGTH_SHORT).show();
                        }
                    }
                });
    }

    private void updateUI(FirebaseUser user) {
        Intent intent = new Intent(mainMenu.this, HomeActivity.class);
        startActivity(intent);
    }
}
Enter fullscreen mode Exit fullscreen mode

Karena pada mainMenu.java nya kita tidak melakukan istansiasi pada layoutnya, maka saya tidak share layoutnya, wokeee.

Dan pada baris kode object class di file mainMenu.java, khususnya pada method updateUI kita melakukan Intent atau berpindah halaman ke activity yang lain, dengan activity bernama HomeActivity maka kita perlu membuat Activity baru, pada saat setelah login langsung dialihkan ke activity yang lain.


Pada HomeActivity.java
Saya tidak melakukan codingan apapun, baik pada layoutnya maupun pada file java classnya. Jadi saya tidak mengeshare apapun yah.

Sekian cuman itu yang bisa share kali ini,semoga bermanfaat.


Wassalamu'alaikum

Top comments (0)