Universal Login を推奨
Auth0 では、独自のカスタムログインページやサインアップページを作成したり、Auth0 ライブラリに埋め込まれたものを使用したりする代わりに利用できる Universal Login を提供しています。サインアップとログインのオプションを提供したいだけで、カスタマイズがアプリケーション名、ロゴ、背景色のみで済むのであれば、Universal Login のほうが簡単に実装できる場合があります。
Lock の使用
Lock はカスタムフィールド付きのサインアップをサポートしています。 Lock のadditionalSignUpFields オプションが使えるのは、Database のサインアップのみです。ソーシャル を使用したサインアップでは、Lock で同じ方法でこれらのフィールドを収集することはできません。ただし、追加のカスタムフィールドを収集しつつ、Lock でソーシャル IDP サインアップを可能にする方法が 2 つあります。
別のページにリダイレクトする
Lock でソーシャルプロバイダーのサインアップを利用し、追加の情報を収集する方法の 1 つとして、redirect rules を使い、ユーザーを別のページにリダイレクトして追加情報を入力してもらい、その後リダイレクトで戻して認証トランザクションを完了させる方法があります。段階的プロファイリング
ソーシャルプロバイダーでユーザーを登録する際にカスタムフィールドのデータを収集する別の方法として、段階的プロファイリングがあります。これにより、時間をかけてユーザープロファイルのデータを徐々に充実させていくことができます。登録時には必要最小限の情報だけを収集し、その後ユーザーがアプリを利用するたびに、少量のデータ (たとえば質問を1つ) ずつ集めて、最終的にプロファイルを完成させます。こうすることで、必要な情報を集めながらも、ユーザーの負担を抑えることができます。というのも、登録時にソーシャルIdPを使う目的は、ユーザーにとってその過程をより手軽でスムーズにすることにあるからです。API の利用
カスタムフィールドを収集するサインアップフォームを作成する
name はユーザープロファイルの属性で、color はカスタムフィールドです。
現在、サインアップ時にユーザーが入力したカスタムフィールドをバリデーションする方法はありません。バリデーションは、ログイン時に Auth0 の Rule で行うか、アプリケーション内のカスタムのサーバーサイドロジックで行う必要があります。
フォームデータを送信する
Auth0 の /dbconnections/signup エンドポイントに POST リクエストを送信します。 送信する内容は次のとおりです。- アプリケーションの
client_id - サインアップするユーザーの
emailとpassword - ユーザーデータの保存先となるデータベース
connectionの名前 - ユーザーの更新したい任意のユーザープロファイル属性 (
given_name、family_name、name、nickname、pictureなど) user_metadataに含める任意のカスタムフィールド
カスタムフィールドの制限事項
ユーザーがサインアップすると、カスタムフィールドはuser_metadata の一部として送信されます。このフィールドには次の制限があります。
user_metadataに含められるフィールドは最大 10 個ですuser_metadata.fieldは文字列である必要がありますuser_metadata.field.value.lengthは 500 文字未満である必要がありますuser_metadata.field.lengthは 100 文字未満である必要がありますuser_metadataの現在のサイズ上限は 16 MB です
リダイレクトモード
ログインに成功すると、Auth0 は、 (id_token) をクエリ文字列に付けて、設定済みのコールバック URL にユーザーをリダイレクトします。
その後、必要なカスタムフィールドをユーザーのプロファイルに追加するには、サーバーから APIv2 を呼び出す必要があります。
サインアップフォームにユーザー名を追加する
よくあるサインアップのカスタマイズとして、サインアップ時にユーザー名を追加する方法があります。 この機能を有効にするには、編集する接続の 設定 タブで、Auth0 Dashboard の Connections > Database セクションにある Requires Username 設定をオンにします。 カスタムフォームでusername フィールドを取得し、リクエストボディに username を追加します。