Lewati ke konten utama

Login Flow (Mobile App)

Dokumentasi ini menjelaskan urutan proses otentikasi khusus untuk klien aplikasi Mobile (Android/iOS). Berbeda dengan Web Frontend, rute Mobile API memiliki lapisan keamanan tambahan (Shared Secret) yang wajib disertakan pada header setiap request.

Kewajiban Header

Semua endpoint dengan prefix /api/mobile/ mewajibkan adanya header X-Mobile-Token pada HTTP Request. Nilai token ini bersifat statis untuk mencegah akses API dari sumber yang tidak diizinkan.

Dari mana mendapatkan token ini? Token ini bukanlah JWT dinamis hasil login, melainkan Shared Secret statis yang dikonfigurasi di environment variables backend. Tim Mobile harus meminta nilai kunci rahasia ini secara langsung kepada Lead Backend / Administrator dan menyimpannya secara aman di dalam Build Config aplikasi (misal: file local.properties Android atau .xcconfig iOS).

Diagram Alur Login Mobile


Urutan Integrasi API untuk Mobile App

Step 1: Submit Kredensial

Aplikasi mengirimkan data login pengguna ke Backend beserta header otentikasi aplikasi mobile.

Request
POST /api/mobile/auth/login
X-Mobile-Token: <SECRET_TOKEN_APLIKASI>
Content-Type: application/json
Request Body
{
"email": "customer@frogcloud.com",
"password": "Password123!"
}

Kondisi & Tindakan:

  • Sukses Tanpa OTP (200 OK): Backend merespons dengan mengembalikan access_token (JWT). Aplikasi mobile harus menyimpan token tersebut (misal di Secure Storage atau Keychain) dan menampilakan layar utama aplikasi.
  • Butuh OTP (200 OK): Backend merespons bahwa OTP telah dikirimkan (biasanya dengan kode spesifik atau properti otp_required: true). Aplikasi tidak boleh langsung masuk ke layar utama, melainkan harus melakukan navigasi ke Layar Input OTP.
  • Error (400/401): Kredensial salah. Tampilkan Snackbar/Toast peringatan kepada pengguna.

Step 2 (Kondisional): Verifikasi OTP

Bila proses terhenti karena meminta OTP, aplikasi meminta pengguna memasukkan kode OTP 6 digit yang dikirimkan ke email mereka.

Request
POST /api/mobile/auth/otp/verify
X-Mobile-Token: <SECRET_TOKEN_APLIKASI>
Content-Type: application/json
Request Body
{
"email": "customer@frogcloud.com",
"code": "123456"
}

Kondisi & Tindakan:

  • Sukses (200 OK): OTP yang dimasukkan valid. Sama seperti skenario "Sukses Tanpa OTP", Backend akan mengembalikan access_token untuk disimpan oleh aplikasi.
  • Error (400 Bad Request): Kode salah. Tampilkan pesan peringatan agar pengguna mengoreksi kodenya.

Manajemen OTP (Resend & Timer)

Untuk menghindari spam pengiriman email, Backend mengimplementasikan jeda waktu (misal: 60 detik) sebelum Pengguna bisa meminta OTP baru. Frontend harus menampilkan Countdown Timer (Hitung Mundur).

Mendapatkan Sisa Waktu (Remaining Time)

Request
GET /api/mobile/auth/otp/remaining
X-Mobile-Token: <SECRET_TOKEN_APLIKASI>

Respons (200 OK): Mengembalikan "remaining_seconds": 45. Aplikasi seluler menggunakan angka ini untuk merender animasi hitung mundur 00:45.

Meminta Ulang OTP (Resend) Jika waktu sudah habis (0 detik), pengguna dapat menekan tombol "Kirim Ulang Kode".

Request
POST /api/mobile/auth/otp/request
X-Mobile-Token: <SECRET_TOKEN_APLIKASI>
Content-Type: application/json
Request Body
{
"email": "customer@frogcloud.com"
}