Tentang MFA pada Janjio

Ketika membuat Janjio, ada satu hal yang cukup sering saya pikirkan: bagaimana memastikan akun pengguna tetap aman?

Awalnya, username dan password mungkin sudah cukup. Tapi semakin saya pikirkan, rasanya masih kurang.

Password bisa saja diketahui orang lain. Karena itu, saya akhirnya memutuskan untuk menambahkan Multi-Factor Authentication (MFA) pada Janjio.

Saya menggunakan metode TOTP, seperti yang digunakan oleh Google Authenticator. Jadi, selain password, pengguna juga membutuhkan kode yang muncul di aplikasi Authenticator.

Di baliknya, saya menggunakan Laravel dengan bantuan pragmarx/google2fa-laravel untuk proses TOTP dan bacon/bacon-qr-code untuk membuat QR Code.

Prosesnya sebenarnya sederhana.

Saat MFA diaktifkan, Janjio membuat sebuah secret key, kemudian mengubahnya menjadi QR Code. QR Code tersebut dipindai menggunakan aplikasi Authenticator.

Setelah itu, pengguna cukup memasukkan kode yang muncul untuk memastikan semuanya sudah terhubung dengan benar.

Sederhana dari sisi pengguna, tetapi ada beberapa hal menarik yang terjadi di belakangnya.

Berikut sedikit bagian kode yang saya gunakan untuk proses setup MFA pada Janjio.

1. Proses Setup: Pembuatan QR Code dan Kunci Rahasia

Saat pengguna memilih untuk mengaktifkan MFA, sistem harus membuatkan sebuah kunci rahasia unik untuk pengguna tersebut. Kunci ini harus disimpan sementara hingga pengguna berhasil memverifikasinya.

use Illuminate\Http\Request;
use Illuminate\Support\Facades\Auth;
use PragmaRX\Google2FAQRCode\Google2FA;

class MFAController extends Controller
{
    public function setup(Request $request)
    {
        $user = Auth::user();
        $google2fa = new Google2FA();

        // 1. Generate kunci rahasia unik
        $secretKey = $google2fa->generateSecretKey();

        // 2. Simpan sementara di session (JANGAN langsung simpan di database)
        $request->session()->put('mfa_setup_secret', $secretKey);

        // 3. Generate QR Code untuk dipindai pengguna
        $qrCodeImage = $google2fa->getQRCodeInline(
            config('app.name'), // Nama Aplikasi
            $user->email,       // Identitas Pengguna
            $secretKey          // Kunci Rahasia
        );

        return view('mfa.setup', [
            'qrCode' => $qrCodeImage, 
            'secret' => $secretKey
        ]);
    }
}

Catatan Keamanan: Perhatikan bahwa kunci rahasia ($secretKey) hanya disimpan di Session pengguna pada tahap ini. Kita tidak boleh menyimpannya langsung ke Database sampai pengguna terbukti bisa memasukkan kode OTP dengan benar. Hal ini untuk mencegah pengguna terkunci (locked out) jika mereka gagal memindai QR code.

2. Proses Aktivasi: Memverifikasi OTP Pertama

Setelah pengguna memindai QR code, mereka harus memasukkan 6 digit angka dari aplikasi Authenticator untuk mengkonfirmasi bahwa proses setup berhasil.

    public function enable(Request $request)
    {
        $request->validate([
            'one_time_password' => 'required|digits:6',
        ]);

        $user = Auth::user();
        $google2fa = new Google2FA();

        // Ambil secret key dari session sementara
        $secretKey = $request->session()->get('mfa_setup_secret');

        // Verifikasi kode OTP yang dimasukkan pengguna
        $isValid = $google2fa->verifyKey($secretKey, $request->one_time_password);

        if ($isValid) {
            // Jika valid, simpan secret key secara permanen di database
            $user->google2fa_secret = $secretKey;
            $user->mfa_enabled = true;
            $user->save();

            // Hapus session sementara dan tandai pengguna sudah terverifikasi
            $request->session()->forget('mfa_setup_secret');
            $request->session()->put('mfa_verified', true);

            return redirect()->route('dashboard')->with('success', 'MFA berhasil diaktifkan!');
        }

        return back()->withErrors(['otp' => 'Kode OTP salah, silakan coba lagi.']);
    }

3. Proses Login: Verifikasi Rutin

Setelah MFA aktif, setiap kali pengguna login dengan username dan password yang benar, sistem akan menahan akses mereka dan meminta kode OTP.

    public function verify(Request $request)
    {
        $request->validate([
            'one_time_password' => 'required|digits:6',
        ]);

        $user = Auth::user();
        $google2fa = new Google2FA();

        // Ambil secret key milik user dari database
        $secretKey = $user->google2fa_secret;

        // Verifikasi kode OTP
        $isValid = $google2fa->verifyKey($secretKey, $request->one_time_password);

        if ($isValid) {
            // Tandai sesi login saat ini telah melewati MFA
            $request->session()->put('mfa_verified', true);

            return redirect()->intended(route('dashboard'));
        }

        return back()->withErrors(['otp' => 'Kode OTP tidak valid.']);
    }

Sistem keamanan tambahan biasanya diatur pada Middleware Laravel. Middleware ini bertugas mengecek apakah sesi mfa_verified bernilai true. Jika belum, pengguna akan terus diarahkan ke halaman input OTP dan tidak bisa mengakses halaman Dashboard.

---

Menerapkan Multi-Factor Authentication sangatlah penting untuk melindungi data. Dengan ekosistem Laravel dan library yang tepat, mengimplementasikan sistem yang aman dan standar industri bisa dilakukan dengan alur yang jelas.

Dengan memisahkan proses setup menggunakan session sementara, kita memastikan pengguna tidak pernah terkunci dari akun mereka sendiri akibat kesalahan saat setup QR Code. Hal-hal detail seperti inilah yang membuat pengembangan perangkat lunak tidak hanya soal fitur yang bekerja, tetapi fitur yang aman.

Semoga penjelasan singkat dan contoh kode ini dapat memberikan wawasan baru tentang bagaimana sebuah aplikasi menjaga keamanan akun penggunanya, terimakasih. sampai jumpa di tulisan lainnya.