Cara Mengirim OTP WhatsApp dari Aplikasi Web - WHAPI

OTP WhatsApp adalah kode sekali pakai yang dikirim ke nomor WhatsApp untuk memverifikasi identitas pengguna pada aplikasi web.

OTP dapat digunakan untuk registrasi akun, login, verifikasi nomor WhatsApp, reset akses, atau konfirmasi tindakan tertentu.

Prosesnya dimulai ketika pengguna memasukkan nomor WhatsApp. Aplikasi kemudian membuat kode OTP, menyimpannya sementara, dan mengirim kode tersebut melalui API WhatsApp.

Cara Kerja OTP WhatsApp

Alur OTP WhatsApp dari aplikasi web terdiri dari dua proses utama: pengiriman kode dan verifikasi kode.

Pengguna memasukkan nomor WhatsApp
        ↓
Aplikasi membuat OTP
        ↓
OTP disimpan
        ↓
API WhatsApp
        ↓
WhatsApp pengguna
        ↓
Pengguna memasukkan OTP
        ↓
Aplikasi memvalidasi OTP
`

Contohnya, pengguna memasukkan nomor:

628123456789

Aplikasi membuat kode:

Kemudian kode tersebut dikirim melalui WhatsApp:

Kode OTP untuk verifikasi akun:

483921

Kode berlaku selama 5 menit.
Jangan bagikan kode ini kepada siapa pun.

Setelah pengguna memasukkan 483921 pada aplikasi, server memeriksa apakah kode sesuai dan masih berlaku.

Data yang Dibutuhkan

Sistem OTP biasanya membutuhkan beberapa data:

Data	Contoh
Nomor WhatsApp	628123456789
OTP	483921
Waktu dibuat	20:00:00
Waktu kedaluwarsa	20:05:00
Status penggunaan	Belum digunakan

Data tersebut dapat disimpan pada database atau penyimpanan sementara seperti Redis.

Contoh struktur data:

phone: 628123456789
otp: 483921
expires_at: 2026-09-27 20:05:00
used: false

Membuat Kode OTP

Kode OTP dapat dibuat menggunakan angka acak.

Contoh menggunakan PHP:

$otp = random_int(100000, 999999);

echo $otp;

Hasilnya berupa kode enam digit, misalnya:

Gunakan generator angka acak yang sesuai untuk proses autentikasi. Hindari membuat OTP dari data yang mudah ditebak seperti timestamp atau nomor urut.

Menyimpan OTP

Setelah OTP dibuat, aplikasi perlu menyimpannya sebelum mengirim kode ke pengguna.

Contoh:

$otpData = [
    'phone' => '628123456789',
    'otp' => $otp,
    'expires_at' => time() + 300,
    'used' => false
];

Pada contoh tersebut, 300 berarti OTP berlaku selama lima menit.

Jika menggunakan database, data dapat disimpan seperti:

Kolom	Contoh
phone	628123456789
otp	483921
expires_at	2026-09-27 20:05:00
used	0

Mengirim OTP melalui API WhatsApp

Setelah OTP dibuat dan disimpan, aplikasi dapat mengirim kode melalui API WhatsApp.

Contoh request menggunakan cURL:

curl -X POST "https://gate.whapi.cloud/messages/text" \
  -d "apiKey=API_KEY_WHAPI" \
  -d "phone=628123456789" \
  --data-urlencode "message=Kode OTP untuk verifikasi akun: 483921. Kode berlaku selama 5 menit."

API key digunakan untuk autentikasi request. Parameter phone menentukan nomor tujuan, sedangkan message berisi kode OTP.

Dokumentasi pengiriman pesan:

API Send Message Whapi

Membuat Pesan OTP WhatsApp

Pesan OTP sebaiknya singkat dan langsung menunjukkan kode yang harus digunakan.

Contoh:

Kode OTP untuk verifikasi akun:

483921

Kode berlaku selama 5 menit.
Jangan bagikan kode ini kepada siapa pun.

Untuk proses login:

Kode OTP untuk login:

483921

Kode berlaku selama 5 menit.

Tidak perlu memasukkan terlalu banyak informasi lain ke dalam pesan OTP.

Contoh Fungsi Mengirim OTP dengan PHP

Fungsi berikut menerima nomor WhatsApp, kode OTP, dan API key:

function sendOtpWhatsApp($phone, $otp, $apiKey)
{
    $message =
        "Kode OTP untuk verifikasi akun:\n\n" .
        $otp .
        "\n\nKode berlaku selama 5 menit. " .
        "Jangan bagikan kode ini kepada siapa pun.";

    $curl = curl_init();

    curl_setopt_array($curl, [
        CURLOPT_URL => 'https://gate.whapi.cloud/messages/text',
        CURLOPT_POST => true,
        CURLOPT_POSTFIELDS => [
            'apiKey' => $apiKey,
            'phone' => $phone,
            'message' => $message
        ],
        CURLOPT_RETURNTRANSFER => true
    ]);

    $response = curl_exec($curl);

    if ($response === false) {
        throw new Exception(curl_error($curl));
    }

    curl_close($curl);

    return $response;
}

Fungsi tersebut dapat dipanggil setelah OTP dibuat dan disimpan.

Contohnya:

$otp = random_int(100000, 999999);

// Simpan OTP ke database

sendOtpWhatsApp(
    '628123456789',
    $otp,
    'API_KEY_WHAPI'
);

Pada aplikasi nyata, nomor WhatsApp sebaiknya berasal dari data pengguna yang sudah divalidasi.

Membuat Endpoint Request OTP

Aplikasi web dapat menyediakan endpoint khusus untuk meminta OTP.

Contoh:

POST /auth/request-otp

Ketika endpoint tersebut dipanggil, server menjalankan proses:

Request OTP
↓
Validasi nomor WhatsApp
↓
Buat OTP
↓
Simpan OTP
↓
Kirim OTP melalui API WhatsApp
↓
Kirim response ke browser

Contoh response:

{
  "success": true,
  "message": "OTP telah dikirim"
}

Browser kemudian dapat menampilkan form untuk memasukkan kode yang diterima melalui WhatsApp.

Membuat Endpoint Verifikasi OTP

Setelah menerima OTP, pengguna memasukkan kode tersebut ke aplikasi.

Contoh endpoint:

POST /auth/verify-otp

Server menerima nomor WhatsApp dan kode OTP, kemudian memeriksa data OTP yang tersimpan.

Alurnya:

Nomor WhatsApp + OTP
        ↓
Cari OTP aktif
        ↓
Periksa masa berlaku
        ↓
Bandingkan kode
        ↓
Tandai OTP sebagai digunakan
        ↓
Lanjutkan proses

Contoh logika PHP:

if ($otpData['used']) {
    throw new Exception('OTP sudah digunakan.');
}

if (time() > $otpData['expires_at']) {
    throw new Exception('OTP sudah kedaluwarsa.');
}

if ($inputOtp !== $otpData['otp']) {
    throw new Exception('OTP tidak sesuai.');
}

// OTP valid
$otpData['used'] = true;

OTP harus ditandai sebagai sudah digunakan setelah verifikasi berhasil agar kode yang sama tidak dapat digunakan kembali.

Membatasi Masa Berlaku OTP

OTP sebaiknya memiliki masa berlaku yang singkat.

Contoh masa berlaku lima menit:

OTP dibuat
↓
00:00
↓
01:00
↓
02:00
↓
03:00
↓
04:00
↓
05:00 → Kedaluwarsa

Jika OTP dibuat pada pukul 20:00, server hanya menerima kode tersebut sampai pukul 20:05.

Pengecekan dilakukan di server:

if (time() > $otp['expires_at']) {
    // OTP tidak valid
}

Jangan hanya menggunakan timer pada browser. Server tetap harus memeriksa masa berlaku OTP saat kode dikirim untuk verifikasi.

Membatasi Request OTP

Endpoint request OTP perlu memiliki batas pengiriman agar satu nomor tidak dapat meminta kode baru berkali-kali dalam waktu singkat.

Contoh:

Request pertama
↓
OTP dikirim

Request kedua dalam 60 detik
↓
Tolak

Setelah 60 detik
↓
OTP baru dapat diminta

Batas dapat diterapkan berdasarkan nomor WhatsApp, akun pengguna, alamat IP, atau kombinasi beberapa parameter.

Menangani OTP Baru

Jika pengguna meminta OTP baru, kode sebelumnya sebaiknya tidak lagi dianggap valid.

Contoh:

OTP 123456 dibuat
↓
Pengguna meminta OTP baru
↓
OTP 789012 dibuat
↓
OTP 123456 tidak berlaku
↓
OTP 789012 menjadi kode aktif

Dengan aturan ini, server hanya menerima OTP terbaru.

Membatasi Percobaan Verifikasi

Selain membatasi request OTP, jumlah percobaan memasukkan OTP juga perlu dibatasi.

Contoh:

Percobaan 1 → Salah
Percobaan 2 → Salah
Percobaan 3 → Salah
Percobaan 4 → Ditolak

Batas tersebut dapat membantu mencegah percobaan menebak kode OTP secara berulang.

Setelah batas tercapai, pengguna dapat diminta meminta OTP baru.

Menangani Kegagalan Pengiriman

Pengiriman OTP dapat gagal karena API key salah, device WhatsApp tidak terhubung, nomor tujuan tidak sesuai, atau masalah pada request.

Server perlu memeriksa response dari API.

Contoh:

$response = curl_exec($curl);
$statusCode = curl_getinfo($curl, CURLINFO_HTTP_CODE);

if ($response === false) {
    error_log(curl_error($curl));
}

if ($statusCode < 200 || $statusCode >= 300) {
    error_log('Gagal mengirim OTP: ' . $response);
}

Jika pengiriman gagal, aplikasi dapat menampilkan pesan agar pengguna mencoba kembali.

OTP juga tidak sebaiknya dianggap berhasil dikirim hanya karena request HTTP berhasil dijalankan. Response dari API perlu diperiksa.

Menyimpan API Key dengan Aman

API key tidak boleh diletakkan pada JavaScript frontend karena pengguna dapat melihat source code dan request yang dibuat browser.

Simpan API key pada server atau environment variable.

Contoh:

WHAPI_API_KEY=API_KEY_WHAPI

Kemudian aplikasi membaca nilai tersebut:

$apiKey = getenv('WHAPI_API_KEY');

Browser cukup mengirim permintaan ke backend aplikasi:

Browser
↓
Backend aplikasi
↓
API WhatsApp

API key tetap berada di server.

Contoh Alur OTP Lengkap

Proses OTP dari aplikasi web dapat dibuat seperti berikut:

1. Pengguna memasukkan nomor WhatsApp
              ↓
2. Server memvalidasi nomor
              ↓
3. Server membuat OTP
              ↓
4. OTP disimpan dengan waktu kedaluwarsa
              ↓
5. Server mengirim OTP melalui API WhatsApp
              ↓
6. Pengguna menerima OTP
              ↓
7. Pengguna memasukkan OTP
              ↓
8. Server memeriksa kode dan masa berlaku
              ↓
9. OTP valid
              ↓
10. Pengguna dapat melanjutkan proses

Proses tersebut dapat digunakan untuk registrasi, login, verifikasi nomor WhatsApp, reset akses, atau konfirmasi tindakan tertentu.

Contoh Struktur Database OTP

Tabel OTP dapat menggunakan struktur sederhana:

Kolom	Tipe	Fungsi
id	integer	ID OTP
phone	varchar	Nomor WhatsApp
otp	varchar	Kode OTP
expires_at	datetime	Waktu kedaluwarsa
used	boolean	Status penggunaan
attempts	integer	Jumlah percobaan
created_at	datetime	Waktu pembuatan

Data OTP yang sudah kedaluwarsa dapat dibersihkan secara berkala agar database tidak menyimpan data yang tidak diperlukan.

Hal yang Perlu Diperhatikan

Beberapa hal penting dalam pengiriman OTP WhatsApp:

Gunakan kode OTP dengan masa berlaku terbatas.
OTP hanya dapat digunakan satu kali.
Batasi permintaan OTP berulang.
Batasi jumlah percobaan verifikasi.
Jangan menampilkan API key pada frontend.
Jangan mengirim OTP melalui URL.
Gunakan HTTPS untuk komunikasi antara browser dan server.
Periksa response API setelah pengiriman.
Jangan mencatat OTP dalam bentuk plaintext pada log produksi.

OTP merupakan bagian dari proses autentikasi, sehingga kode dan kredensial API perlu diperlakukan sebagai data yang harus dilindungi.

Kesimpulan

Cara mengirim OTP WhatsApp dari aplikasi web terdiri dari pembuatan kode OTP, penyimpanan kode, pengiriman melalui API WhatsApp, dan verifikasi kode di server.

Alurnya:

Buat OTP
↓
Simpan OTP
↓
Kirim melalui API WhatsApp
↓
Pengguna menerima kode
↓
Pengguna memasukkan OTP
↓
Validasi kode
↓
Tandai OTP sebagai digunakan

API WhatsApp menangani pengiriman pesan, sedangkan aplikasi web menangani pembuatan OTP, masa berlaku, pembatasan request, dan proses verifikasi.

Dengan alur tersebut, OTP WhatsApp dapat digunakan untuk registrasi, login, verifikasi nomor, reset akses, dan proses autentikasi lainnya pada aplikasi web.

Cara Kerja OTP WhatsApp

Data yang Dibutuhkan

Membuat Kode OTP

Menyimpan OTP

Mengirim OTP melalui API WhatsApp

Membuat Pesan OTP WhatsApp

Contoh Fungsi Mengirim OTP dengan PHP

Membuat Endpoint Request OTP

Membuat Endpoint Verifikasi OTP

Membatasi Masa Berlaku OTP

Membatasi Request OTP

Menangani OTP Baru

Membatasi Percobaan Verifikasi

Menangani Kegagalan Pengiriman

Menyimpan API Key dengan Aman

Contoh Alur OTP Lengkap

Contoh Struktur Database OTP

Hal yang Perlu Diperhatikan

Kesimpulan

Artikel Populer