JavaScript を使用して電子メール アドレスを効果的に検証するにはどうすればよいですか?

JavaScript 電子メール検証: 総合ガイド

電子メール アドレスの検証は、Web 開発において有効な送信を保証し、スパムを防ぐために非常に重要です。 JavaScript では、電子メール検証を実行する方法がいくつかあります。

正規表現: ゴールデン スタンダード

正規表現は、電子メール検証のための強力で信頼性の高い方法を提供します。これらを使用すると、有効な電子メール構造に正確に一致する複雑なパターンを定義できます。 Unicode 文字を処理する包括的な正規表現の例を次に示します。

const 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,}))$/i;

この式は、文字列 "^" の先頭から末尾 "$" までのすべての文字に一致し、電子メール アドレス全体が検証されました。次のチェックが含まれます:

• ローカル部分: 最初のキャプチャ グループで定義され、山括弧、括弧、バックスラッシュ、括弧、カンマ、セミコロン、コロン、スペース、引用符を除く有効な文字が含まれます。 .
• ドメイン部分: 2 番目のグループでキャプチャされ、IPv4 アドレスまたは完全修飾ドメインをサポートします。
• トップレベル ドメイン: 3 番目のキャプチャ グループによって照合され、2 つ以上のアルファベット文字が許可されます。

実際の例

JavaScript でメール アドレスを指定するには、次のような関数を使用できます。

const validateEmail = (email) => {
  return email.match(re);
};

Calling validateEmail(email) は、電子メールが有効な場合は配列を返し、検証に失敗した場合は null を返します。

JavaScript を使用したクライアント側の検証

電子メールの検証は、次を使用してクライアント側で実装できます。 JavaScript。以下に例を示します。

const emailInput = document.getElementById('email');
emailInput.addEventListener('input', () => {
  const result = document.getElementById('result');
  const email = emailInput.value;
  if (validateEmail(email)) {
    result.textContent = `${email} is valid.`;
    result.style.color = 'green';
  } else {
    result.textContent = `${email} is invalid.`;
    result.style.color = 'red';
  }
});

このコードは、入力フィールドと結果要素を作成します。ユーザーが電子メールを入力すると、有効性がチェックされ、結果が適切なスタイルで表示されます。

サーバー側の検証: 重要なステップ

JavaScript の検証だけでは十分ではないことに注意してください。ユーザーは簡単に JavaScript を無効にして、検証を無効にすることができます。したがって、精度を確保し、悪意のある試みから保護するには、同様の手法を使用してサーバー側で検証することが不可欠です。

以上がJavaScript を使用して電子メール アドレスを効果的に検証するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。