Wie lässt sich eine E-Mail-Adresse am besten in JavaScript validieren?

Question

Wie kann ich eine E-Mail-Adresse in JavaScript am besten mit einem regulären Ausdruck überprüfen?

Answer 1

Verwendung von reguläre Ausdrücke ist wahrscheinlich der beste Weg. Sie können eine Reihe von Tests sehen aquí (entnommen aus Chrom )

const validateEmail = (email) => {
  return String(email)
    .toLowerCase()
    .match(
      /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/
    );
};

Hier ist ein Beispiel für einen regulären Ausdruck, der Unicode akzeptiert:

const re =
  /^(([^<>()[\]\.,;:\s@\"]+(\.[^<>()[\]\.,;:\s@\"]+)*)|(\".+\"))@(([^<>()[\]\.,;:\s@\"]+\.)+[^<>()[\]\.,;:\s@\"]{2,})$/i;

Denken Sie aber daran, dass Sie sich nicht nur auf die JavaScript-Validierung verlassen sollten. JavaScript kann leicht deaktiviert werden. Dies sollte auch auf der Serverseite validiert werden.

Hier ist ein Beispiel für die oben beschriebene Vorgehensweise:

const validateEmail = (email) => {
  return email.match(
    /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/
  );
};

const validate = () => {
  const $result = $('#result');
  const email = $('#email').val();
  $result.text('');

  if (validateEmail(email)) {
    $result.text(email + ' is valid :)');
    $result.css('color', 'green');
  } else {
    $result.text(email + ' is not valid :(');
    $result.css('color', 'red');
  }
  return false;
}

$('#email').on('input', validate);

Und das ist die html :

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<label for="email">Enter an email address: </label>
<input id="email" />
<h2 id="result"></h2>

Answer 2

Ich habe leicht modifiziert Jaymon's Antwort für Leute, die eine wirklich einfache Validierung in Form von:

anystring@anystring.anystring

Der reguläre Ausdruck:

/\S+@\S+\.\S+/

Um zu verhindern, dass mehrere @-Zeichen übereinstimmen:

/^[^\s@]+@[^\s@]+\.[^\s@]+$/

Beispiel für eine JavaScript-Funktion:

function validateEmail(email) 
    {
        var re = /\S+@\S+\.\S+/;
        return re.test(email);
    }

console.log(validateEmail('anystring@anystring.anystring'));

Answer 3

Nur der Vollständigkeit halber, hier haben Sie eine weitere RFC 2822-konforme Regex

Die offizielle Norm ist bekannt als RFC 2822 . Sie beschreibt die Syntax, die gültige E-Mail-Adressen einhalten müssen. Sie können ( aber Sie sollten nicht - weiter lesen ) mit diesem regulären Ausdruck implementieren:

(?:[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*|"(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21\x23-\x5b\x5d-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])*")@(?:(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?|\[(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?|[a-z0-9-]*[a-z0-9]:(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21-\x5a\x53-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])+)\])

(...) Wir erhalten eine praktischere Implementierung von RFC 2822, wenn wir die Syntax mit doppelten Anführungszeichen und eckigen Klammern weglassen. Sie stimmt immer noch mit 99,99 % aller heute tatsächlich verwendeten E-Mail-Adressen überein.

[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*@(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?

Eine weitere Änderung, die Sie vornehmen könnten, besteht darin, alle zweistelligen Ländercodes als Domänen oberster Stufe und nur bestimmte generische Domänen oberster Stufe zuzulassen. Diese Regex filtert Dummy-E-Mail-Adressen wie asdf@adsf.adsf . Sie müssen sie aktualisieren, wenn neue Top-Level-Domains hinzugefügt werden .

[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*@(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+(?:[A-Z]{2}|com|org|net|gov|mil|biz|info|mobi|name|aero|jobs|museum)\b

Selbst wenn man sich an offizielle Normen hält, muss man also Kompromisse eingehen. Kopieren Sie nicht blindlings reguläre Ausdrücke aus Online-Bibliotheken oder Diskussionsforen. Testen Sie sie immer an Ihren eigenen Daten und mit Ihren eigenen Anwendungen.

_{Hervorhebung von mir}

Answer 4

Wow, hier gibt es viel Komplexität. Wenn alles, was Sie tun wollen, ist nur fangen die offensichtlichsten Syntaxfehler, würde ich etwas wie dieses tun:

^\S+@\S+$

Sie fängt in der Regel die offensichtlichsten Fehler ab, die der Benutzer macht, und stellt sicher, dass das Formular größtenteils richtig ist, worauf es bei der JavaScript-Validierung ankommt.

EDIT: Wir können auch nach '.' in der E-Mail suchen, indem wir

/^\S+@\S+\.\S+$/

Answer 5

Es gibt etwas, das Sie verstehen müssen, sobald Sie sich entscheiden, einen regulären Ausdruck zur Validierung von E-Mails zu verwenden: Das ist wahrscheinlich keine gute Idee. . Wenn Sie sich damit abgefunden haben, gibt es viele Implementierungen, die Sie auf halbem Weg dorthin bringen können, Dieser Artikel fasst sie sehr gut zusammen.

Kurz gesagt, die einzige Möglichkeit, absolut sicher zu sein, dass das, was der Benutzer eingegeben hat, tatsächlich eine E-Mail ist, besteht darin, tatsächlich eine E-Mail zu senden und zu sehen, was passiert. Ansonsten ist alles nur eine Vermutung.