recherche

Maison >interface Web >js tutoriel >JS rend la vérification e-mail/adresse e-mail régulière

JS rend la vérification e-mail/adresse e-mail régulière

php中世界最好的语言
php中世界最好的语言original
2018-06-09 14:09:186186parcourir

Cette fois, je vais vous apporter JS pour faire une vérification régulière de l'e-mail/de l'adresse e-mail. Quelles sont les précautions à prendre pour utiliser JS pour faire une vérification régulière de l'e-mail/de l'adresse e-mail ? Voici un cas pratique, jetons un coup d'oeil.

Les règles sont définies comme suit :

  • avec des lettres majuscules [A-Z], des lettres minuscules [a-z], des chiffres [0-9], un trait de soulignement [_], et signe moins Il commence par [-] et un point [.], et doit être répété une ou plusieurs fois [+].

  • doit inclure le symbole @ au milieu.

  • @ doit être suivi de lettres majuscules [A-Z], de lettres minuscules [a-z], de chiffres [0-9], d'un trait de soulignement [_], d'un signe moins [-] et d'un point [ .], et doit être répété une ou plusieurs fois [+].

  • doit se terminer par un point [.] reliant 2 à 4 chiffres de lettres majuscules et minuscules [A-Za-z]{2,4}.

Utilisez les règles ci-dessus pour donner l'expression régulière suivante : 

var pattern = /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/;

Code de test complet

<!DOCTYPE HTML>
<html>
<head>
  <meta charset="utf-8">
  <title>邮箱/邮件地址的正则表达式及分析(JavaScript，email，regex)</title>
</head>
<body>
<p id="main"></p>
<script>
  var pattern = /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/;
  w("pattern.test('cn42du@163.com') = "+pattern.test('cn42du@163.com')+";");
  w("pattern.test('ifat3@sina.com.cn') = "+pattern.test('ifat3@sina.com.cn')+";");
  w("pattern.test('ifat3.it@163.com') = "+pattern.test('ifat3.it@163.com')+";");
  w("pattern.test('ifat3_-.@42du.cn') = "+pattern.test('ifat3_-.@42du.cn')+";");
  w("pattern.test('ifat3@42du.online') = "+pattern.test('ifat3@42du.online')+";");
  w("pattern.test('毛三胖@42du.cn') = "+pattern.test('毛三胖@42du.cn')+";");
  function w(val) {
    document.getElementById("main").innerHTML += val +"<br />";
  }
</script>
</body>
</html>

Résultat du test :

pattern.test('cn42du@163.com') = true;
pattern.test('ifat3@sina.com.cn') = true;
pattern.test('ifat3 . it@163.com') = true;
pattern.test('ifat3_-.@42du.cn') = true;
pattern.test('ifat3@42du.online') = false;
pattern.test('Mao Sanpang@42du.cn') = false;
pattern.test('cn42du@163.com') = true;
pattern.test('ifat3@sina.com. cn') = true;
pattern.test('ifat3.it@163.com') = true;
pattern.test('ifat3_-.@42du.cn') = true;
pattern .test('ifat3@42du.online') = false;
pattern.test('Mao Sanpang@42du.cn') = false;

Description de l'option 1

Le schéma 1 est le schéma de vérification des expressions régulières de courrier électronique le plus couramment utilisé et convient à la plupart des scénarios d'application. Comme le montre le test ci-dessus, cette expression ne prend pas en charge les noms de domaine se terminant par .online et .store. Si vous devez être compatible avec ce type de nom de domaine (plus de 4 chiffres), ajustez simplement la partie restriction à la fin de l'expression régulière {2,4} (par exemple : {2,8}). Un autre problème est que les noms d’utilisateur de messagerie ne peuvent pas inclure de caractères chinois.

Option 2 (option 1 révisée)

Les règles sont complétées comme suit :

  • Les noms d'utilisateur peuvent inclure le chinois [u4e00 -u9fa5 ]

  • La fin du nom de domaine peut comporter jusqu'à 8 caractères {2,8}

  • L'expression régulière mise à jour est la suivante suit : 

var pattern = /^([A-Za-z0-9_\-\.\u4e00-\u9fa5])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,8})$/;

Code de test complet

<!DOCTYPE HTML>
<html>
<head>
  <meta charset="utf-8">
  <title>邮箱/邮件地址的正则表达式及分析(JavaScript，email，regex)</title>
</head>
<body>
<p id="main"></p>
<script>
  var pattern = /^([A-Za-z0-9_\-\.\u4e00-\u9fa5])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,8})$/;
  w("pattern.test('cn42du@163.com') = "+pattern.test('cn42du@163.com')+";");
  w("pattern.test('ifat3@sina.com.cn') = "+pattern.test('ifat3@sina.com.cn')+";");
  w("pattern.test('ifat3.it@163.com') = "+pattern.test('ifat3.it@163.com')+";");
  w("pattern.test('ifat3_-.@42du.cn') = "+pattern.test('ifat3_-.@42du.cn')+";");
  w("pattern.test('ifat3@42du.online') = "+pattern.test('ifat3@42du.online')+";");
  w("pattern.test('毛三胖@42du.cn') = "+pattern.test('毛三胖@42du.cn')+";");
  function w(val) {
    document.getElementById("main").innerHTML += val +"<br />";
  }
</script>
</body>
</html>

Résultat du test :

pattern.test('cn42du@163. com') = vrai;
pattern.test('ifat3@sina.com.cn') = true;
pattern.test('ifat3.it@163.com') = vrai;
modèle .test('ifat3_- .@42du.cn') = true;
pattern.test('ifat3@42du.online') = true;
pattern.test('马三fat@42du.cn' ) = true;

Option 3 (Sécurité)

Avant l'apparition du code de vérification du téléphone mobile, la vérification par e-mail était presque la seule condition pour garantir l'unicité de l'utilisateur. L’émergence de boîtes aux lettres temporaires (également appelées boîtes aux lettres de 10 minutes ou boîtes aux lettres jetables) rend inutile le mécanisme de vérification des boîtes aux lettres et d’activation des comptes. Les adresses e-mail temporaires ne sont pas énumérables. Nous pouvons uniquement utiliser une liste blanche pour permettre à un nombre limité de noms de domaine de messagerie de passer la vérification.

Règles supplémentaires selon l'option 1 :

Le nom de domaine email ne peut être que 163.com, qq.com ou 42du.cn.
L'expression régulière est donnée comme suit : 

var pattern = /^([A-Za-z0-9_\-\.])+\@(163.com|qq.com|42du.cn)$/;

Code de test complet

<!DOCTYPE HTML>
<html>
<head>
  <meta charset="utf-8">
  <title>邮箱/邮件地址的正则表达式及分析(JavaScript，email，regex)</title>
</head>
<body>
<p id="main"></p>
<script>
  var pattern = /^([A-Za-z0-9_\-\.])+\@(163.com|qq.com|42du.cn)$/;
  w("pattern.test('cn42du@163.com') = "+pattern.test('cn42du@163.com')+";");
  w("pattern.test('ifat3@sina.com.cn') = "+pattern.test('ifat3@sina.com.cn')+";");
  w("pattern.test('ifat3.it@163.com') = "+pattern.test('ifat3.it@163.com')+";");
  w("pattern.test('ifat3_-.@42du.cn') = "+pattern.test('ifat3_-.@42du.cn')+";");
  w("pattern.test('ifat3@42du.online') = "+pattern.test('ifat3@42du.online')+";");
  w("pattern.test('毛三胖dd@42du.cn') = "+pattern.test('毛三胖@42du.cn')+";");
  function w(val) {
    document.getElementById("main").innerHTML += val +"<br />";
  }
</script>
</body>
</html>

Résultats du test : 

pattern.test('cn42du@163.com') = true;
pattern.test('ifat3@sina.com.cn') = false;
pattern.test('ifat3.it@163.com') = true;
pattern.test('ifat3_-.@42du.cn') = true;
pattern.test('ifat3@42du.online') = false;
pattern.test('毛三胖dd@42du.cn') = false;

Bien que la vérification du schéma 3 puisse garantir propriété de sécurité, mais si la liste blanche est trop longue, la chaîne de modèle sera trop longue. À ce stade, vous pouvez écrire la liste blanche des noms de domaine de messagerie sous forme de tableau, utiliser des expressions régulières pour la vérification préliminaire et utiliser la liste blanche pour la vérification secondaire du nom de domaine.

La fonction de vérification des e-mails est désormais présentée comme suit : 

var isEmail = function (val) {
  var pattern = /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/;
  var domains= ["qq.com","163.com","vip.163.com","263.net","yeah.net","sohu.com","sina.cn","sina.com","eyou.com","gmail.com","hotmail.com","42du.cn"];
  if(pattern.test(val)) {
    var domain = val.substring(val.indexOf("@")+1);
    for(var i = 0; i< domains.length; i++) {
      if(domain == domains[i]) {
        return true;
      }
    }
  }
  return false;
}
// 输出 true
isEmail(cn42du@163.com);

La fonction isEmail() ci-dessus répertorie 11 noms de domaine de messagerie couramment utilisés. Vous pouvez les ajouter ou les supprimer selon vos besoins.

Je pense que vous maîtrisez la méthode après avoir lu le cas dans cet article. Pour des informations plus intéressantes, veuillez prêter attention aux autres articles connexes sur le site Web chinois de php !

Lecture recommandée :

Code d'état 302 dans axios

Encapsulez le crochet de navigation de routage Vue2 et utilisez-le dans le combat réel

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration：
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Article précédent：JS + Regex vérifie le numéro d'identificationArticle suivant：JS + Regex vérifie le numéro d'identification

Articles Liés

Voir plus