أكثر 5 أخطاء يقع فيها المطورون عند تكامل WhatsApp OTP (وكيف تتجنبها)

// ❌ Wrong — missing country code
const phone = "07701234567";

await fetch("https://api.nabdaotp.com/api/v1/messages/send", {
  body: JSON.stringify({ phone, message: "Your OTP: 123456" })
});

// ✅ Correct — E.164 format
const phone = "+9647701234567"; // Iraq
// const phone = "+9639XXXXXXXX"; // Syria
// const phone = "+201XXXXXXXXX"; // Egypt

await fetch("https://api.nabdaotp.com/api/v1/messages/send", {
  body: JSON.stringify({ phone, message: "Your OTP: 123456" })
});

// ❌ Wrong — using global Nabda token, not instance token
const res = await fetch("https://api.nabdaotp.com/api/v1/messages/send", {
  headers: { "Authorization": `Bearer ${globalApiToken}` }
});
// Result: 401 Unauthorized

// ✅ Correct — select instance first, then use instance token
const selectRes = await fetch(
  "https://api.nabdaotp.com/api/v1/auth/select-instance",
  {
    method: "POST",
    headers: { "Content-Type": "application/json" },
    body: JSON.stringify({ instanceId: "your-instance-id" })
  }
);
const { accessToken } = await selectRes.json();

// Now use accessToken for messages
const res = await fetch("https://api.nabdaotp.com/api/v1/messages/send", {
  headers: { "Authorization": `Bearer ${accessToken}` }
});

// ❌ Wrong — storing plain OTP and verifying on the client
const otp = "482917";
localStorage.setItem("otp", otp); // NEVER DO THIS

// Client-side verification — easily bypassed
if (userInput === localStorage.getItem("otp")) {
  allowLogin();
}

// ✅ Correct — hash on backend, verify on backend
import crypto from "crypto";

const SECRET = process.env.OTP_SECRET;
const otp    = generateOTP(); // e.g. "482917"
const hash   = crypto.createHash("sha256")
                 .update(otp + SECRET)
                 .digest("hex");

// Store hash + expiry in DB, never the plain OTP
await db.otpStore.set(userId, { hash, expiresAt: Date.now() + 5 * 60 * 1000 });

// On verification — backend only
function verifyOTP(input, storedHash) {
  const inputHash = crypto.createHash("sha256")
    .update(input + SECRET).digest("hex");
  return inputHash === storedHash;
}

// ❌ Wrong — no expiry, no rate limiting
// OTP stored forever, brute-forceable

app.post("/verify", (req, res) => {
  const { otp } = req.body;
  if (otp === storedOtp) { // stored without expiry
    res.json({ success: true });
  }
});

// ✅ Correct — expiry check + rate limiting
const MAX_ATTEMPTS = 5;
const OTP_TTL_MS   = 5 * 60 * 1000; // 5 minutes

app.post("/verify", rateLimiter({ max: MAX_ATTEMPTS, window: "15m" }), async (req, res) => {
  const record = await db.otpStore.get(userId);

  if (!record) return res.status(400).json({ error: "OTP expired or not found" });
  if (Date.now() > record.expiresAt) return res.status(400).json({ error: "OTP expired" });
  if (!verifyOTP(req.body.otp, record.hash)) return res.status(400).json({ error: "Invalid OTP" });

  await db.otpStore.delete(userId); // single-use
  res.json({ success: true });
});

// ❌ Wrong — not handling instance disconnection
// Instance QR expires or WhatsApp disconnects — messages silently fail
// No alert, no fallback, users never receive their OTP

// ✅ Correct — configure webhook + monitor instance status
// 1. Set up webhook on Nabda dashboard or via API:
await fetch("https://api.nabdaotp.com/api/v1/instances/webhook", {
  method: "PATCH",
  headers: { "Authorization": `Bearer ${instanceToken}` },
  body: JSON.stringify({
    webhookUrl: "https://yourdomain.com/nabda/webhook",
    webhookEnabled: true
  })
});

// 2. Handle events in your webhook handler:
app.post("/nabda/webhook", (req, res) => {
  const { event, status } = req.body;

  if (event === "instance.disconnected") {
    // Alert your team — re-scan QR code required
    notifyTeam("Nabda instance disconnected — OTP delivery paused");
  }

  if (event === "message.failed") {
    // Log and retry or fallback to SMS
    handleDeliveryFailure(req.body);
  }

  res.sendStatus(200);
});