Tutorial: Fitur Reset Password via Email OTP (Part 3)

🔐 Cara Membuat Fitur Reset Password PHP + MySQL dengan Email OTP (Part 3)

Halo teman ngoding! Kali ini kita akan melanjutkan seri login PHP & MySQL kita dengan fitur yang sangat penting, yaitu reset password menggunakan OTP via email. Fitur ini bikin aplikasi kamu kelihatan profesional dan tentunya meningkatkan keamanan pengguna. 👨‍💻

🔍 Apa yang Akan Kita Buat?

• Form input email untuk reset password
• Kirim OTP ke email user (pakai PHPMailer)
• Form verifikasi OTP
• Form ganti password baru

1. Tambahkan Kolom OTP di Tabel Users

ALTER TABLE users 
ADD otp_code VARCHAR(6), 
ADD otp_expiry DATETIME;

2. Form Reset Password - forgot-password.php

<?php
require 'config.php';
require 'mailer/sendmail.php';

if ($_SERVER['REQUEST_METHOD'] === 'POST') {
    $email = $_POST['email'];
    $otp = rand(100000, 999999);
    $expiry = date('Y-m-d H:i:s', strtotime('+10 minutes'));

    $stmt = $conn->prepare("UPDATE users SET otp_code=?, otp_expiry=? WHERE email=?");
    $stmt->bind_param('sss', $otp, $expiry, $email);
    $stmt->execute();

    send_otp_email($email, $otp); // kirim OTP via email
    header("Location: verify-otp.php?email=" . urlencode($email));
    exit;
}
?>

<form method="post">
  <input type="email" name="email" placeholder="Email anda" required>
  <button type="submit">Kirim OTP</button>
</form>

3. Kirim Email OTP dengan PHPMailer

Kamu bisa gunakan PHPMailer untuk mengirim kode OTP ke email. Berikut contoh fungsinya:

// sendmail.php
use PHPMailer\PHPMailer\PHPMailer;

function send_otp_email($to, $otp) {
    $mail = new PHPMailer(true);
    $mail->isSMTP();
    $mail->Host = 'smtp.gmail.com';
    $mail->SMTPAuth = true;
    $mail->Username = 'emailkamu@gmail.com';
    $mail->Password = 'aplikasi-password';
    $mail->SMTPSecure = 'tls';
    $mail->Port = 587;

    $mail->setFrom('emailkamu@gmail.com', 'Sistem Reset');
    $mail->addAddress($to);
    $mail->Subject = 'Kode OTP Reset Password';
    $mail->Body = "Kode OTP kamu: $otp. Berlaku 10 menit.";

    $mail->send();
}

4. Verifikasi OTP - verify-otp.php

<?php
require 'config.php';
$email = $_GET['email'];

if ($_SERVER['REQUEST_METHOD'] === 'POST') {
    $otp = $_POST['otp'];
    $now = date('Y-m-d H:i:s');

    $stmt = $conn->prepare("SELECT * FROM users WHERE email=? AND otp_code=? AND otp_expiry >= ?");
    $stmt->bind_param('sss', $email, $otp, $now);
    $stmt->execute();
    $res = $stmt->get_result();

    if ($res->num_rows === 1) {
        header("Location: reset-password.php?email=" . urlencode($email));
        exit;
    } else {
        $err = "Kode OTP salah atau sudah kedaluwarsa!";
    }
}
?>

<form method="post">
  <input name="otp" placeholder="Kode OTP" required>
  <button type="submit">Verifikasi OTP</button>
</form>

5. Ganti Password Baru - reset-password.php

<?php
require 'config.php';
$email = $_GET['email'];

if ($_SERVER['REQUEST_METHOD'] === 'POST') {
    $newpass = password_hash($_POST['password'], PASSWORD_DEFAULT);
    $stmt = $conn->prepare("UPDATE users SET password=?, otp_code=NULL, otp_expiry=NULL WHERE email=?");
    $stmt->bind_param("ss", $newpass, $email);
    $stmt->execute();

    echo "Password berhasil direset. <a href='login.php'>Login Sekarang</a>";
}
?>

<form method="post">
  <input type="password" name="password" placeholder="Password baru" required>
  <button type="submit">Reset Password</button>
</form>

✅ Tips Keamanan

• Gunakan OTP maksimal 10 menit dan hapus setelah digunakan
• Gunakan password_hash() untuk menyimpan password
• Jangan gunakan SMTP pribadi tanpa enkripsi (gunakan TLS)
• Validasi email apakah terdaftar sebelum kirim OTP

🎉 Kesimpulan

Dengan menambahkan fitur reset password ini, aplikasi login kamu sekarang jauh lebih aman dan profesional. Jangan lupa lanjut ke tutorial berikutnya tentang sistem multi role user (admin & user biasa).

Kalau kamu terbantu, yuk bantu share artikel ini ke teman-temanmu. Sampai jumpa di tutorial selanjutnya! 🚀