Hướng dẫn Gravity Forms OTP Verification SMS/Email từ A–Z trên WordPress

Gravity Forms OTP Verification SMS/Email là gì?

Gravity Forms là một plugin rất mạnh để tạo biểu mẫu trên WordPress. Tuy nhiên, một Form thông thường không thể đảm bảo rằng địa chỉ email hoặc số điện thoại do khách hàng nhập vào thực sự thuộc quyền kiểm soát của người đó.

>> Tham khảo: Hướng dẫn cài đặt Gravity Forms trên WordPress

Đây là lúc OTP Verification trở nên hữu ích.

OTP là viết tắt của One-Time Password, tức mã xác minh chỉ sử dụng cho một lần hoặc trong một khoảng thời gian ngắn.

Quy trình có thể hình dung như sau:

Khách hàng nhập Email / Số điện thoại
↓
Nhấn Send Code
↓
Hệ thống tạo OTP
↓
Gửi OTP qua Email hoặc SMS
↓
Khách nhập OTP
↓
Verify OTP
↓
Xác minh thành công
↓
Submit Form

Plugin Gravity Forms – OTP Verification (SMS/EMAIL) của Pigment Development bổ sung trực tiếp một trường OTP Verify vào Gravity Forms. Plugin có thể ngăn Form được gửi nếu người dùng chưa hoàn thành bước xác minh. Nó cũng hỗ trợ Conditional Logic, giới hạn gửi lại OTP và nhiều SMS Gateway.

Đây là giải pháp đặc biệt phù hợp cho Form đăng ký dịch vụ, tạo hợp đồng, đăng ký tài khoản, gửi yêu cầu quan trọng hoặc bất kỳ Form nào mà doanh nghiệp cần hạn chế dữ liệu giả.

OTP Verification có tác dụng gì đối với Gravity Forms?

Hãy lấy một Form đăng ký dịch vụ làm ví dụ.

Form yêu cầu:

Họ và tên
Email
Số điện thoại
Tên công ty
Mã số thuế
Gói dịch vụ
Đồng ý điều khoản

Nếu không sử dụng OTP, một người có thể nhập:

Email: abc@example.com
Phone: 0900000000

và Submit ngay cả khi email hoặc số điện thoại đó không thuộc về họ.

Nếu sử dụng OTP, hệ thống sẽ yêu cầu:

Email
↓
Send Code
↓
1234
↓
Verify
↓
Verified

chỉ khi đó Form mới được hoàn tất.

Điều cần hiểu rõ là OTP xác minh quyền truy cập vào email hoặc số điện thoại tại thời điểm xác minh, chứ không đồng nghĩa với xác minh danh tính pháp lý của người dùng. Nếu Form liên quan tới giao dịch hoặc hợp đồng quan trọng, OTP nên được xem là một lớp xác nhận bổ sung chứ không phải giải pháp KYC hoàn chỉnh.

Cài Gravity Forms – OTP Verification trên WordPress

Trước tiên, website phải có Gravity Forms đang hoạt động.

Sau đó truy cập: WordPress Admin → Plugins → Add New Plugin

Tìm: Gravity Forms – OTP Verification (SMS/EMAIL)

Nhà phát triển: Pigment Development

Sau đó chọn: Install Now → Activate

Cài đặt plugin Gravity Forms – OTP Verification (SMS/EMAIL)

Cài đặt plugin Gravity Forms – OTP Verification (SMS/EMAIL)

Giao diện cài đặt OTP Verification

Sau khi kích hoạt, plugin thêm khu vực cấu hình OTP vào menu Gravity Forms.

Giao diện cài đặt OTP Verification

Giao diện cài đặt OTP Verification

Bạn sẽ thấy các tab chính như: General, Mobile, Email, Translate, String Replace, Documentation, Logs

Giao diện cài đặt chính thức của plugin cũng hiển thị các khu vực này.

Trong một hệ thống thực tế, ba tab quan trọng nhất là:

  • General để thiết lập bảo mật và thời gian chờ.
  • Email nếu bạn xác minh bằng email.
  • Mobile nếu bạn xác minh bằng SMS.

Cấu hình General Settings

Trong màn hình General, plugin cung cấp các thiết lập quan trọng như Max Failed Attempt, Mobile Regex, Lockdown Delay, Resend Delay và nội dung các nút Send/Resend Code.

Active Debug Mode

Debug Mode dùng để hỗ trợ kiểm tra khi OTP xảy ra lỗi.

Trên website production, không nên bật Debug liên tục nếu không cần thiết.

Chỉ bật khi đang troubleshooting và tắt lại sau khi hoàn tất.

Max Failed Attempt

Đây là số lần người dùng được phép nhập OTP sai.

Ví dụ: Max Failed Attempt = 3

Có nghĩa người dùng có thể thử tối đa ba lần trước khi cơ chế khóa của plugin được áp dụng.

Đây là thiết lập rất quan trọng vì nếu cho nhập OTP không giới hạn, người dùng hoặc bot có thể thử nhiều mã liên tục.

Một mức khởi đầu hợp lý với Form thông thường là: 3–5 lần

Lockdown Delay

Sau khi người dùng nhập sai OTP quá số lần cho phép, plugin có thể bắt họ chờ trước khi thử lại.

Ví dụ: Lockdown Delay = 10 phút

Cấu hình này giúp chống brute-force OTP tốt hơn.

Màn hình cấu hình mẫu của nhà phát triển cũng sử dụng Max Failed Attempt = 3 và Lockdown Delay = 10 phút.

Không nhất thiết phải sử dụng đúng các con số này, nhưng đây là điểm bắt đầu khá hợp lý.

Resend Delay

Không nên cho người dùng bấm liên tục:

Send Code → Send Code → Send Code → Send Code

Đặc biệt nếu dùng SMS vì mỗi SMS có thể phát sinh chi phí.

Plugin cho phép thiết lập thời gian chờ trước khi gửi OTP mới.

Ví dụ: Resend Delay = 60 giây

Người dùng sẽ phải chờ một phút trước khi yêu cầu OTP tiếp theo.

WordPress.org cũng mô tả plugin có cơ chế resend OTP với cooldown limit.

Tôi khuyên nên bắt đầu với khoảng 60 giây.

Mobile Regex – kiểm tra định dạng số điện thoại

Plugin cho phép đặt Regular Expression để kiểm tra số điện thoại trước khi gửi OTP.

Nếu website chủ yếu phục vụ khách hàng Việt Nam, bạn có thể tham khảo Regex đơn giản:

^(?:\+84|0)(?:3|5|7|8|9)\d{8}$

Regex trên chấp nhận dạng:

0901234567

hoặc:

+84901234567

Tuy nhiên cần phân biệt hai việc:

Regex chỉ kiểm tra định dạng.

Nó không nhất thiết tự động chuyển:

0901234567

thành:

+84901234567

Nếu SMS Gateway yêu cầu chuẩn quốc tế E.164, bạn vẫn cần đảm bảo dữ liệu được chuyển sang format mà Gateway yêu cầu.

NOTE: Ở bài viết này thì mình chú trọng Email OTP miễn phí hơn SMS OTP trả phí nha

Tùy chỉnh chữ trên nút OTP

Trong General Settings, plugin cho phép thay đổi các chuỗi như:

  • Send Code
  • Resend Code
  • Wait %d Sec.

Nếu website tiếng Việt, có thể đổi thành:

  • Gửi mã OTP
  • Gửi lại mã
  • Vui lòng chờ %d giây

Việc Việt hóa các nút nhỏ này giúp trải nghiệm Form chuyên nghiệp hơn rất nhiều.

Cách tạo Email OTP trong Gravity Forms

Đây là phương án tôi khuyên triển khai đầu tiên vì dễ cấu hình hơn SMS.

Quy trình sẽ là:

Gravity Forms
↓
Email Field
↓
OTP Verify Field
↓
WordPress wp_mail()
↓
SMTP
↓
Email khách hàng

Plugin sử dụng hàm email mặc định của WordPress là wp_mail(). Vì vậy bạn có thể sử dụng SMTP của hosting, WP Mail SMTP hoặc dịch vụ email khác để gửi OTP.

Bước 1: Tạo Email Field

Mở Form cần sử dụng:

Forms → chọn Form → Edit

Thêm Field:

Email

Ví dụ đặt Label:

Email

Description:

Mã xác thực OTP sẽ được gửi tới địa chỉ email này.

Bật:

Required

để người dùng bắt buộc nhập email.

Bước 2: Thêm OTP Verify Field

Trong Form Editor, plugin bổ sung một Field có tên:

OTP Verify

Kéo hoặc click để thêm OTP Verify vào Form.

OTP Verify Field

OTP Verify Field

Bước 3: Chọn số chữ số OTP

Trong Field Settings → OTP Verify, bạn sẽ thấy tùy chọn:

OTP Digits: 4

Tức OTP có dạng: 5731

Nếu phiên bản của bạn cung cấp nhiều lựa chọn, bạn có thể chọn độ dài OTP phù hợp.

Với Form không quá nhạy cảm, 4–6 chữ số thường dễ sử dụng.

Bước 4: Chọn Receiver Field

Đây là bước rất quan trọng.

Trong OTP Field, tìm:

Receiver Field

Bạn cần chỉ định Field nào chứa email hoặc số điện thoại nhận OTP.

Ví dụ Form có:

Email khách hàng – Field ID 26

thì chọn:

Receiver Field → Email ID 26

Receiver Field

Receiver Field

Nếu chọn nhầm Receiver Field, OTP sẽ không gửi đến đúng nơi bạn mong muốn.

Bước 5: Chọn OTP Type = Email OTP

Trong cùng phần Field Settings, tìm:

OTP Type

Chọn:

Email OTP

Sau đó:

Save Form

Cấu hình Email Settings cho OTP

Tiếp tục vào:

Forms → OTP Verification → Email

Plugin cung cấp các trường:

  • OTP-Email Subject
  • Email Sender Name
  • Email Sender Address
  • Email Template (HTML)

và phần Preview/Test Email.

Ví dụ bạn có thể cấu hình:

OTP-Email Subject:
Mã xác thực của bạn

Email Sender Name:
Webchuyennghiep247

Email Sender Address:
no-reply@domain.com

Tùy chỉnh Email Template OTP

Plugin cho phép chỉnh trực tiếp HTML của email OTP và có phần Preview ngay trong trang Settings.

 <div style="font-family:Arial,sans-serif;">
<h2>Mã xác thực OTP</h2>

<p>Mã xác thực của Quý khách là:</p>

<div style="
font-size:28px;
font-weight:bold;
letter-spacing:6px;
">
{otp}
</div>

<p>
Vui lòng không chia sẻ mã này với người khác.
</p>
</div> 

Hãy giữ nguyên placeholder OTP mà phiên bản plugin của bạn cung cấp. Trong giao diện chính thức hiện có các token dùng trong template, bao gồm token dành cho OTP.

Tùy chỉnh Email Template OTP

Tùy chỉnh Email Template OTP

Đừng tự thay đổi cú pháp token nếu chưa kiểm tra vì OTP có thể không được chèn vào email.

Bạn nên Send Test OTP Email xem nhận được mail như mong muốn chưa và điều chỉnh trước khi làm tiếp. Chỉ khi email test hoạt động ổn định mới tiếp tục đưa Form ra ngoài website.

Cách cấu hình SMS OTP

SMS phức tạp hơn Email OTP vì bạn cần có SMS Gateway có nghĩa plugin Gravity Forms – OTP Verification không tự trực tiếp gửi tin nhắn mà đóng vai trò làm cầu nối. Để gửi được SMS, nó cần liên kết với một plugin cổng tin nhắn (SMS Gateway) trung gian.

Việc thiết lập SMS OTP khá phức tạp (cần qua nhiều lớp plugin trung gian) và tốn kém chi phí trả cho nhà mạng, nên sử dụng Email OTP có sẵn là giải pháp tối ưu, hoàn toàn miễn phí và dễ dàng cài đặt hơn rất nhiều.

Đánh giá của bạn

Leave a Reply

Select Language