Wie kann ich eine E-Mail-Adresse in JavaScript am besten mit einem regulären Ausdruck überprüfen?
Dies ist eine JavaScript-Übersetzung der Validierung, die im offiziellen Rails-Leitfaden vorgeschlagen und von Tausenden von Websites verwendet wird:
/^([^@\s]+)@((?:[-a-z0-9]+\.)+[a-z]{2,})$/iRelativ einfach, prüft aber auf die häufigsten Fehler.
Getestet an einem Datensatz von Tausenden von E-Mails und es gab keine falsch negativen/positiven Ergebnisse.
Beispiel für die Verwendung:
const emailRegex = /^([^@\s]+)@((?:[-a-z0-9]+\.)+[a-z]{2,})$/i;
emailRegex.test('email@example.com'); // true
// Multi-word domains
emailRegex.test('email@example.co.uk'); // true
emailRegex.test('email@mail.gmail.com'); // true
// Valid special characters
emailRegex.test('unusual+but+valid+email1900=/!#$%&\'*+-/=?^_`.{|}~@example.com') // true
// Trailing dots
emailRegex.test('email@example.co.uk.'); // false
// No domain
emailRegex.test('email@example'); // false
// Leading space
emailRegex.test(' email@example.com'); // false
// Trailing space
emailRegex.test('email@example.com '); // false
// Incorrect domains
emailRegex.test('email@example,com '); // false
// Other invalid emails
emailRegex.test('invalid.email.com') // false
emailRegex.test('invalid@email@domain.com') // false
emailRegex.test('email@example..com') // false
Am besten ist es, entweder das integrierte HTML5-E-Mail-Tag zu verwenden.
<input type="email" name="email">oder die übliche E-Mail-Syntax zur Erkennung von @ und . aus der Zeichenkette ist unten angegeben.
^[a-zA-Z0-9_\-.]+@[a-zA-Z0-9\-]+\.[a-zA-Z0-9\-.]+$Beachten Sie, dass dies immer noch zu folgenden Ergebnissen führen würde ungültige E-Mail die noch mit der Regex übereinstimmen, ist es fast unmöglich, sie alle zu erwischen, aber dies wird verbessert die Situation ein wenig.
Siehe früherer Kommentar 32 Dies ist gut, aber das Problem dabei ist, dass es innerhalb eines Formular-Tags sein muss und durch eine Submit-Eingabe übermittelt wird, was nicht jeder den Luxus hat, zu tun. Außerdem kann man die Fehlermeldung nicht wirklich gestalten. - @Jason 12. November '11 um 0:08
Ich habe @mevius und @Boldewyn Code gemischt, um diesen ultimativen Code für die E-Mail-Verifizierung mit JavaScript zu erstellen.
function ValidateEmail(email){
var re = /^(([^<>()\[\]\\.,;:\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,}))$/;
var input = document.createElement('input');
input.type = 'email';
input.value = email;
return typeof input.checkValidity == 'function' ? input.checkValidity() : re.test(email);
}Ich habe diesen Code in meinem Blog veröffentlicht aquí .
Die Lösung von Sectrean funktioniert großartig, aber bei mir hat sie versagt Linter . Also habe ich einige Fluchtwege hinzugefügt:
function validateEmail(email){
var re = /^(([^<>()[]\\.,;:\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,}))$/;
return re.test(email);
}
Hier ist eine Funktion, die ich für die Validierung von E-Mails im Frontend verwende. (Der reguläre Ausdruck stammt aus parsley.js)
<!DOCTYPE html>
<html>
<head>
<title>Our Company</title>
<style>
.form-style {
color: #ccc;
}
</style>
</head>
<body>
<h1>Email Validation Form Example</h1>
<input type="text" name="email" id="emailInput" class="form-style">
<script>
function validateEmail(emailAddress) {
var regularExpression = /^((([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+(\.([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+)*)|((\x22)((((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(([\x01-\x08\x0b\x0c\x0e-\x1f\x7f]|\x21|[\x23-\x5b]|[\x5d-\x7e]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(\\([\x01-\x09\x0b\x0c\x0d-\x7f]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]))))*(((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(\x22)))@((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]))){2,6}$/i;
return regularExpression.test(emailAddress);
}
function showEmailValidationState(event) {
if (validateEmail(event.target.value)) {
document.getElementById("emailInput").style.color = 'black';
}
}
document.getElementById("emailInput").addEventListener("keyup", showEmailValidationState);
</script>
</body>
</html> CodeJaeger ist eine Gemeinschaft für Programmierer, die täglich Hilfe erhalten..
Wir haben viele Inhalte, und Sie können auch Ihre eigenen Fragen stellen oder die Fragen anderer Leute lösen.
23 Stimmen
@Alex Der Grund, warum ich diesen Kommentar hinzugefügt habe, ist, dass die vorgeschlagene Regex in der akzeptierten Antwort keine existierenden Live-E-Mail-Adressen zulässt, was ein schlechter Start für einen Kunden ist, und das wirklich große Problem ist, dass selbst WENN die Adresse akzeptiert wurde, sie immer noch nicht sagt, ob sie funktioniert. Die einzige Möglichkeit, zuverlässig zu überprüfen, ob eine angegebene E-Mail eine funktionierende, gültige E-Mail ist, besteht darin, eine E-Mail mit einem Verifizierungslink zu senden. Wenn Ihr Anwendungsfall also keine Verifizierung der E-Mail erfordert, genügt ein minimaler Test auf @, andernfalls sollten Sie eine Verifizierungs-E-Mail verwenden. Regex wird nur eine schlechte Benutzererfahrung bieten.
0 Stimmen
@David Mårtensson Ich habe ein + auf Ihre Gedanken hinzugefügt. Ich denke jedoch, dass eine Verifizierungs-E-Mail-Link-Sache auch eine schlechte Benutzererfahrung sein kann. Eine, die Sie einen Kunden verlieren kann.
7 Stimmen
@mikael1000 Sicher, aber was ist der Zweck einer Regex-Validierung, wenn man sowieso nicht weiß, ob es eine gültige E-Mail ist. Wenn Sie den Kunden nicht mit einem Validierungslink belästigen wollen, machen Sie einfach die einfachste Validierung <irgendwas> bei <irgendwas> und belassen es dabei. Damit stellen Sie sicher, dass der Kunde zumindest etwas eingegeben hat, das eine E-Mail sein könnte, alles andere ist meist Codeverschwendung, bis Sie zur eigentlichen Validierung kommen. Sie könnten möglicherweise überprüfen, ob die Domäne mit einem DNS-Lookup existiert.
0 Stimmen
@DavidMårtensson Wenn ein Kunde in seiner E-Mail ein Zeichen falsch eingibt, wird die E-Mail mit Regexp validiert, wenn sie immer noch falsch ist. Das Ergebnis wird sein: keine Kommunikation möglich. Für mich ist das das schlechteste Benutzererfahrung, die man sich vorstellen kann. Eine Validierungsbestätigung verwickelt den Nutzer in ein Gespräch, das Respekt und echtes Interesse an den Bedürfnissen des Kunden zeigt.
0 Stimmen
Wenn Sie dem Muster von Gmail/Yahoo/Outlook/... folgen wollen, verwenden Sie dies einfacher Regex
2 Stimmen
Sehr ähnlich: Wie kann ich eine E-Mail-Adresse mithilfe eines regulären Ausdrucks überprüfen?
0 Stimmen
Wenn diese Frage offen bleiben soll, muss "Validierung" entfernt werden, andernfalls sollte sie geschlossen werden.
2 Stimmen
Diese Frage wird diskutiert auf meta .
0 Stimmen
@theking2 Ich stimme zu, dass regex nur hilft, das Standard-E-Mail-Format zu überprüfen, aber es wird nicht bestätigen, dass die eingegebene E-Mail-Adresse gültig oder erreichbar ist. Dieses Problem wird von einigen Echtzeit-E-Mail-Validierungstools angegangen. Sie müssen vielleicht prüfen clearout.io/integrationen/echtzeit-javascript-email-validierung . Es hilft sogar, die falsch eingegebene E-Mail-Adresse vorzuschlagen.
0 Stimmen
Ich empfehle, diesen Artikel über die Funktionsweise der E-Mail-Syntax zu lesen: debounce.io/blog/articles/email-syntax-error-explained
0 Stimmen
Ist damit Ihre Frage beantwortet? Wie kann ich eine E-Mail-Adresse mithilfe eines regulären Ausdrucks überprüfen?
3 Stimmen
Ich muss zugeben, dass ich nicht verstehe, warum so viel Validierung betrieben wird, wenn man nicht vorhersagen kann, ob der Benutzer überhaupt einen Basistyp unter Verwendung der gültigen Zeichen erstellt hat. Eine Prüfung auf @ und mindestens einen Punkt reicht am Anfang aus.