Webエンジニア向けプログラミング解説動画をYouTubeで配信中!
▶ チャンネル登録はこちら

【ITニュース解説】Email Verification with Better-Auth (Basics Tutorial, Ep. 2)

2025年09月22日に「Dev.to」が公開したITニュース「Email Verification with Better-Auth (Basics Tutorial, Ep. 2)」について初心者にもわかりやすく解説しています。

作成日: 更新日:

ITニュース概要

Better-Authチュートリアル第2弾では、ユーザー登録時のメール認証機能を解説。誰でも好きなメールで登録できてしまう問題を解決するため、Better-Authの組み込み機能とメールサービスを連携させ、アドレス所有者の確認を行う。これにより、不正アカウントを防ぎ、より安全なシステムを構築する手順を学ぶ。

ITニュース解説

ニュース記事は、ウェブサービスにユーザー登録する際の「メール認証」の重要性と、それを「Better-Auth」というライブラリを使って実装する方法について解説している。システムエンジニアを目指す初心者にとって、ウェブアプリケーションのセキュリティを確保するために、このメール認証の概念は非常に重要である。

まず、なぜメール認証が必要なのかという根本的な問題から説明する。ウェブサービスでは、ユーザーが新規登録する際にメールアドレスとパスワードを入力する。しかし、もしメール認証の仕組みがなければ、ユーザーは存在しないデタラメなメールアドレスや、他人のメールアドレスを登録することができてしまう。サービス側は、そのメールアドレスが本当にユーザー本人に属しているかを確認する手段がないため、問題なく登録を受け入れてしまうのだ。このような状況は、複数の深刻な問題を引き起こす。例えば、悪意のあるユーザーが大量の偽アカウントを作成し、スパムメールの送信元として悪用したり、サービスのリソースを消費したりする可能性がある。また、パスワードリセットなどの重要な機能が、登録されたメールアドレスに依存している場合、偽のメールアドレスで登録されたアカウントは、第三者による乗っ取りのリスクに晒されることになる。これらのセキュリティ上の脆弱性は、サービス全体の信頼性を大きく損ない、実際の運用において許されるものではない。

この重大な問題を解決するために、記事では「Better-Auth」という認証ライブラリを用いたメール認証の導入を提案している。Better-Authは、ユーザー認証機能を簡単に実装できるように設計されており、その中にメールとパスワードを用いた認証方法において、メールアドレスの所有を確認する機能が最初から組み込まれている点が大きな特長である。

Better-Authを使ってメール認証を実装するプロセスは、いくつかの明確なステップに分けられる。 最初のステップは「メールプロバイダーの構成」だ。ウェブアプリケーションがユーザーに認証メールを送信するには、専門のメール送信サービスが必要になる。記事では「Resend」というサービスが使用されている。Resendのようなメールプロバイダーを利用することで、開発者はメール送信に関する複雑な技術的詳細やインフラの管理から解放され、手軽に信頼性の高いメール送信が可能になる。Resendを利用するには、まずアカウントを作成し、自分のサービスが利用するカスタムドメインを登録する。そして、アプリケーションからResendのサービスを呼び出すための秘密の鍵である「APIキー」を発行する。このAPIキーは非常に機密性が高いため、通常は「.envファイル」という環境変数を管理するファイルに保存され、アプリケーションのコード内から安全に読み込まれるようにする。

次に「メールテンプレートの作成」を行う。認証メールは、ユーザーに「アカウントを有効にするには、こちらのリンクをクリックしてください」といった明確な指示と、実際にクリックできる認証リンクを含む必要がある。これらのメールのデザインや文面は、ユーザーに届く最終的な形式として、メールプロバイダー(この場合はResend)の管理画面上で「メールテンプレート」として設定される。これにより、アプリケーションのコードを変更することなく、メールの内容を柔軟に管理・更新できるようになる。

三番目のステップは「Better-Authでのメール認証の有効化」である。これはBetter-Authの設定ファイルに数行のコードを追加するだけで実現できる。具体的には、Better-Authの設定オブジェクト内で、メールとパスワードによる認証を有効にし(emailAndPassword.enabled: true)、さらにメール認証を必須にする設定(emailAndPassword.requireEmailVerification: true)を加える。加えて、「emailVerification」という項目で、ユーザーがサインアップした直後に自動的に認証メールを送信する設定(sendOnSignUp: true)や、メール認証が完了した後に自動的にユーザーをシステムにサインインさせる設定(autoSignInAfterVerification: true)を行う。最も重要なのは、sendVerificationEmailという関数を定義する部分だ。ここでは、Better-Authが認証メールを送る必要があると判断した際に、実際にユーザーのメールアドレス、認証用のURL、認証トークンといった情報を受け取り、それらを使ってResendなどのメールプロバイダーを通じてメールを送信する具体的な処理を記述する。

四番目のステップは「サインアップ時に認証メールを送信する」というユーザー体験に関する部分だ。Better-Authの設定が完了すると、新規ユーザーがサービスにサインアップすると、Better-Authは自動的に設定されたメールプロバイダーを通じて認証メールを送信する。ユーザーが登録フォームを送信した後、アプリケーションはユーザーを「メール認証を促す専用ページ」へリダイレクトする。このページには、「メールボックスを確認し、送られてきたリンクをクリックしてアカウントを有効にしてください」といったメッセージが表示され、ユーザーに次の行動を促す。これにより、ユーザーは自分のメールボックスを確認し、送られてきた認証メールを開くことになる。

最後のステップは、この一連のフローが正しく機能するかを「テスト」することだ。実際に自分のメールアドレスを使ってサービスに登録し、その後の流れを確認する。登録後、設定したメールプロバイダーから認証メールが届くはずだ。そのメールを開き、含まれている認証リンクをクリックすると、ウェブアプリケーションのサーバー側でその認証リンクが有効なものかを検証する。検証が成功すれば、Better-Authの設定により、ユーザーは自動的にサービスにサインインされ、通常はサービスのホームページなどの初期画面にリダイレクトされる。この一連の動作が問題なく完了すれば、メール認証は正しく設定されたことになり、ユーザーは無事にアカウントを有効化し、サービスを利用開始できる。

このように、Better-Authを用いたメール認証は、メール送信サービスであるResendの簡単な構成と、Better-Authの数行の設定変更、そしてシンプルなメールテンプレートの作成だけで実現できる。この仕組みを導入することで、ウェブアプリケーションは「ユーザーが登録したメールアドレスの所有者であること」を確実に確認できるようになる。これにより、偽のアカウントによる登録がブロックされ、サービスの安全性が大幅に向上し、より信頼性が高く、本番環境で安心して利用できるシステムを構築することが可能になるのだ。システムエンジニアを目指す上で、このような認証・認可の仕組みを理解し、安全なウェブアプリケーションを構築する技術を身につけることは、非常に重要なスキルとなる。

関連コンテンツ

関連IT用語