Menu

ログイン

Nexty.devのログイン機能はSupabase Authを基盤として実装されています。Supabase Authを選んだ理由は、開発者にとって認知負荷を最小限に抑える選択肢の一つだからです:

  • 簡単な設定 - 技術的なバックグラウンドがなくても、Supabase統合ドキュメントに従えばエラーが起こりません
  • Supabase Authには組み込みのトークンとクッキー管理メカニズムがあり、これはプラットフォームの安定性とセキュリティに関わります - もはやこれに時間を費やす必要がありません
  • Supabaseデータベースとの完璧な統合、特にデータベースアクセス制御について(詳細なSupabase認証カバレッジは次の記事で)

サポートされているログイン方法

グローバルに運営される製品の場合、Google OAuthとメールログインは避けられません。あなたの製品が開発者の注目を集めることも目的としている場合、GitHub OAuthも重要な選択肢です。したがって、Nexty.devではデフォルトでこれら3つのログイン方法をサポートしています:Google OAuth、GitHub OAuth、メールMagic Link。

Supabase AuthはApple、Azure(Microsoft)、Discord、Facebook、Notionなど、数多くの主流サードパーティログインをサポートしています。GitHubとGoogle OAuthの設定方法をマスターすれば、他のプラットフォームのログイン方法の追加は楽々です。

Supabase Auth List

メールエイリアスフィルタリング

Nexty.devソースコードのlib/email.tsファイルには、メール検証(validateEmail)とメールエイリアスフィルタリング(normalizeEmail)という2つの重要なメソッドが含まれています。これら2つのメソッドは、異常なメールやメールエイリアスからのリスクをある程度防ぐことができます。

多くのユーザーは、GmailやOutlookなどのメールサービスがプレフィックスやサフィックスを追加してエイリアスとして使用することをサポートしていることを知らないかもしれません。無料トライアルを提供するSaaS製品の場合、これによりユーザーがメールエイリアスを通じて無制限にアカウントを登録してトライアル特典を得る可能性があります。

components/providers/AuthProvider.tsxでは、normalizeEmailメソッドを通じてこれらのメールエイリアスをフィルタリングしています:

const signInWithEmail = async (email: string) => {
  return await supabase.auth.signInWithOtp({
    email: normalizeEmail(email), // メールエイリアスをフィルタリング
    // ... 省略 ...
  });
};

注目すべき点

  • ソースコードのバージョンがv1.0.1より前の場合、上記のメールフィルタリング機能を手動で追加する必要があります
  • ソースコードのバージョンはpackage.jsonVersionフィールドで確認できます