‏تأیید ایمیل مستقیم توی مرورگر

تو این مقاله Phil Nash سراغ Email Verification API رفته، یه پروپوزال جدید تو WICG که می‌خواد تأیید ایمیل رو ببره داخل خود مرورگر. الان روال معمول اینه که براش OTP یا لینک جادویی می‌فرستی و کاربر باید صفحه رو ول کنه، بره اینباکس و کد رو کپی کنه. نویسنده می‌گه همین رفت‌وبرگشت جریان کار کاربر رو می‌شکنه و حواسش رو پرت می‌کنه، در حالی که با این API کاربر اصلاً از صفحه بیرون نمی‌ره.

مکانیزمش چهار طرف داره: کاربر، مرورگر، سرویس ایمیل (issuer) و سرور تو (verifier). کاربر که توی میل‌باکسش لاگین می‌کنه، مرورگر این رو ثبت می‌کنه. بعداً وقتی همون ایمیل رو توی فرم سایت تو می‌نویسه، مرورگر چک می‌کنه که آدرس با حساب لاگین‌شده جور باشه، بعد با سرویس ایمیل یه توکن می‌سازه و توی یه input مخفی فرم می‌ذاره. سرور تو با اعتبارسنجی همون توکن مطمئن می‌شه ایمیل مال کاربره.

سمت فرانت کار خیلی کمه: فیلد ایمیل باید type="email" و autocomplete="email" داشته باشه، و کنارش یه فیلد مخفی با autocomplete="email-verification-token" و یه nonce (یعنی یه رشتهٔ تصادفی که فقط یه بار مصرف می‌شه) که به session کاربر گره خورده.

<input id="email" name="email" type="email" autocomplete="email">
<input type="hidden" name="token" nonce={nonce} autocomplete="email-verification-token">

سمت سرور اما کار سنگین‌تره: باید توکن رو پارس کنی، لوکاپ DNS و شبکه بزنی و امضاها رو بررسی کنی. نویسنده برای همین یه پکیج npm به اسم email-verification-api نوشته که با verifyEmailToken این کارو یکجا انجام می‌ده و ورودی‌هاش ایمیل و توکن فرم، origin سایت و nonce داخل session هستن. یه نمونهٔ کامل Next.js هم توی همون ریپو هست.

نکتهٔ مهم اینه که این API هنوز در حد پروپوزاله: فقط Chrome اونم از طریق origin trial پشتیبانی می‌کنه و تأیید میل‌باکس هم فقط سمت Gmail کار می‌کنه. نویسنده پیشنهاد می‌ده فعلاً به‌عنوان progressive enhancement ازش استفاده کنی و برای بقیهٔ حالت‌ها همون سرویس‌های تأیید ایمیل معمولی که syntax و رکورد MX و سرور SMTP رو چک می‌کنن سر جاشون بمونن.

نکات کلیدی:

• Email Verification API یه پروپوزال WICG برای تأیید ایمیل داخل مرورگره، بدون OTP و لینک جادویی
• چهار طرف درگیرن: کاربر، مرورگر، سرویس ایمیل به‌عنوان issuer و سرور سایت به‌عنوان verifier
• سمت فرانت فقط یه input ایمیل با autocomplete درست و یه input مخفی با مقدار email-verification-token و nonce لازمه
• پکیج npm به اسم email-verification-api با تابع verifyEmailToken بررسی سمت سرور رو انجام می‌ده
• فعلاً فقط Chrome با origin trial و Gmail پشتیبانی دارن، پس فقط به شکل progressive enhancement به درد می‌خوره