Notice: Function _load_textdomain_just_in_time was called incorrectly. Translation loading for the wordpress-seo domain was triggered too early. This is usually an indicator for some code in the plugin or theme running too early. Translations should be loaded at the init action or later. Please see Debugging in WordPress for more information. (This message was added in version 6.7.0.) in /var/www/vinascript/html/wp-includes/functions.php on line 6114
Validate email hợp lệ với Javascript - VinaScript

Latest Post

Triển khai dự án PHP, Mysql với Nginx trên Docker Tìm hiểu về HTML – Ưu điểm, nhược điểm và cách hoạt động của HTML

Trong thế giới công nghệ hiện đại, địa chỉ email đã trở thành một phần quan trọng của đời sống số, tương tự như số điện thoại di động. Do đó, nhiều ứng dụng sử dụng email như một yếu tố quan trọng để xác định và liên kết với tài khoản người dùng. Điều này có thể áp dụng cho ứng dụng của bạn, và nếu bạn quan tâm đến vấn đề này, đây là bài viết phản ánh một số phương pháp và giải pháp.

Trong quá trình phát triển ứng dụng, có nhiều tình huống mà bạn cần kiểm tra tính hợp lệ của một địa chỉ email mà người dùng nhập vào. Điều này thường xuyên xuất hiện trong quá trình đăng ký tài khoản hoặc quá trình đăng nhập.

Với ngôn ngữ lập trình JavaScript cũng như nhiều ngôn ngữ khác, một cách phổ biến để kiểm tra tính hợp lệ của địa chỉ email là sử dụng biểu thức chính quy (regular expression). Dưới đây là một ví dụ về cách sử dụng JavaScript để kiểm tra tính hợp lệ của một địa chỉ email. Hy vọng rằng bạn sẽ tận dụng được nó trong các dự án sắp tới của mình. 😊

Thế nào là một địa chỉ email hợp lệ

Căn cứ theo tài liệu đặc tả mới nhất về email là RFC 5322, trong này họ đã mô tả chi tiết thế nào là một địa chỉ email hợp lệ.

Tài liệu mô tả thì nó nhiều tiêu chí lắm, cảnh báo bạn đọc nó có thể sẽ bị “tiền đình” đấy. Đã từng như vậy nên mình sẽ tóm gọn lại các quy tắc xác định email hợp lệ như sau:

Một địa chỉ email được chia là 2 phần và được ngăn cách bởi ký tự @. Cụ thể: local-part@domain

Phần local-part chấp nhận các ký tự sau:

  • Là các chữ in hoa (A-Z) hoặc chữ thường (a-z)
  • Là các chữ số (0-9)
  • Chấp nhận các ký tự đặc biệt: ! # $ % & ‘ * + – / = ? ^ _ ` { | } ~
  • Chấp nhận ký tự dấu chấm (.)

Phần domain phải tuân theo quy tắc sau:

  • Là các chữ cái in hoa (A-Z) hoặc thường (a-z)
  • Là các chữ số (0-9)
  • Chấp nhận dấu gạch ngang (-)
  • Chấp nhận dấu chấm (.)

Validate email sử dụng Regular Expression

Chúng ta sẽ viết một hàm với đầu vào là một string, kết quả trả về là true/false tương ứng nếu string đó là một địa chỉ email hợp lệ.

  • const validate = email => {
  • const expression = /^((?:[A-Za-z0-9!#$%&’*+\-\/=?^_`{|}~]|(?<=^|\.)”|”(?=$|\.|@)|(?<=”.*)[ .](?=.*”)|(?<!\.)\.){1,64})(@)((?:[A-Za-z0-9.\-])*(?:[A-Za-z0-9])\.(?:[A-Za-z0-9]){2,})$/i
  • return expression.test(String(email).toLowerCase())
  • }

Để đảm bảo hàm chạy đúng, chúng ta thử chạy unit test cái nhỉ.

  • console.log(validate(‘foo@bar.com’)) // true
  • console.log(validate(‘foo+foo@bar.com’)) // true
  • console.log(validate(‘foo @bar.com’)) // false
  • console.log(validate(‘{a}!%?@@bar.com’)) // false

Quá trình kiểm tra hợp lệ (validate) được thực hiện tại phía client (trình duyệt) là một bước quan trọng, tuy nhiên, không nên hoàn toàn phụ thuộc vào nó. Việc này là bởi vì bạn vẫn cần thực hiện kiểm tra lại ở phía server để đề phòng những trường hợp như việc trình duyệt tắt chức năng Javascript hoặc các tình huống nhạy cảm khác.

Trong trường hợp hệ thống sử dụng NodeJS làm phía backend, bạn có thể tái sử dụng mã kiểm tra hợp lệ từ phía client một cách thuận tiện. Điều này giúp tối ưu hóa quy trình và đảm bảo tính nhất quán giữa hai phía, mang lại sự thuận lợi cho việc phát triển.

Trên đây là chỉ là một giải pháp validate email bằng javascript, bạn có giải pháp nào ổn hơn thì để lại bình luận bên dưới nhé.

Để lại một bình luận

Email của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *