> ## Documentation Index
> Fetch the complete documentation index at: https://translations.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

> Lock または Auth0 API を使用して、追加フィールドを含むユーザーのサインアップフォームをカスタマイズする方法。

# Lock または Auth0 API を使用したカスタムサインアップ。

Lock または Auth0 API を使用すると、メールアドレスとパスワードに加えて、追加のフィールドを含むようユーザーのサインアップフォームをカスタマイズできます。

[Lock と Custom UI](/ja/docs/customize/login-pages/classic-login/customize-with-lock-sdk) のどちらにするかを決める前に、考慮すべき点が数多くあります。たとえば、Lock を使用する場合は、別のページにリダイレクトしてデータを収集したり、プログレッシブプロファイリングを使用したりできます。Auth0 API を使用する場合は、カスタムフィールドを取得してデータベースに保存できます。どの方法が目的に最も適しているかを選ぶ際には、カスタマイズに関するいくつかの制約も考慮する必要があります。一般的なカスタマイズの例としては、username の追加やパスワード強度の検証があります。

<Card title="Universal Login を推奨">
  Auth0 には、独自のカスタムログインページやサインアップページを設計したり、Auth0 ライブラリに埋め込まれたものを使用したりする代わりに利用できる [Universal Login](/ja/docs/authenticate/login/auth0-universal-login) オプションがあります。サインアップとログインのオプションを提供したく、アプリケーション名、ロゴ、背景色だけをカスタマイズすればよい場合は、Universal Login のほうが簡単に実装できる可能性があります。
</Card>

<div id="using-lock">
  ## Lock を使用する
</div>

Lock は[カスタムフィールド付きのサインアップ](/ja/docs/libraries/lock/lock-configuration)をサポートしています。

Lock の `additionalSignUpFields` オプションは、データベース接続でのサインアップでのみ機能します。ソーシャル <Tooltip tip="IDプロバイダー（IdP）: デジタルアイデンティティを保存および管理するサービス。" cta="用語集を表示" href="/ja/docs/glossary?term=identity+providers">IDプロバイダー</Tooltip> を使用するサインアップでは、Lock で同じ方法でこれらのフィールドを収集することはできません。ただし、追加のカスタムフィールドを引き続き収集しながら、Lock でソーシャル IdP サインアップを有効にする別の方法が 2 つあります。

<div id="redirect-to-another-page">
  ### 別のページにリダイレクトする
</div>

Lock でソーシャルプロバイダーのサインアップを使用してカスタムフィールドを収集する方法の 1 つは、[リダイレクトルール](/ja/docs/customize/rules/redirect-users) を使ってユーザーを別のページにリダイレクトし、そこで追加情報を入力してもらった後、認証トランザクションを完了するために元のフローへリダイレクトで戻すことです。

<div id="progressive-profiling">
  ### 段階的プロファイリング
</div>

ソーシャルプロバイダーを使ってユーザー登録する際にカスタムフィールドのデータを収集するもう 1 つの方法として、[段階的プロファイリング](/ja/docs/manage-users/user-accounts/user-profiles/progressive-profiling) があります。これは、時間をかけて少しずつユーザープロファイルデータを充実させていく方法です。登録時には必要最小限の情報だけを収集し、その後ユーザーがアプリを利用する中で、都度少量のデータ (たとえば質問を 1 つ) を追加で収集していき、ユーザープロファイルを完成させます。これにより、必要な情報を収集しながらも、ユーザーの負担を抑えられます。ソーシャルIdPを使って登録する目的は、ユーザーにとって登録をより手間なくスムーズにすることだからです。

<div id="using-the-api">
  ## API を使用する
</div>

<div id="create-a-signup-form-to-capture-custom-fields">
  ### カスタムフィールドを収集するサインアップフォームを作成する
</div>

`name` はユーザープロフィールの属性で、`color` はカスタムフィールドです。

現在、サインアップ時にユーザーが入力したカスタムフィールドを検証する方法はありません。検証は、ログイン時に Auth0 の [Rule](/ja/docs/customize/rules) で行うか、アプリケーション内のカスタムの **サーバーサイド** ロジックで行う必要があります。

<div id="send-the-form-data">
  ### フォームデータを送信する
</div>

Auth0 の [/dbconnections/signup](https://auth0.com/docs/api/authentication/reference#signup) エンドポイントに POST リクエストを送信します。

送信する必要がある項目:

* アプリケーションの `client_id`
* サインアップするユーザーの `email` と `password`
* ユーザーデータの保存先となるデータベース `connection` の名前
* ユーザーに設定する任意のユーザープロフィール属性 (`given_name`、`family_name`、`name`、`nickname`、`picture` など)
* `user_metadata` の一部として送信する任意のカスタムフィールド

<div id="custom-fields-limitations">
  ## カスタムフィールドの制限事項
</div>

ユーザーがサインアップすると、カスタムフィールドは `user_metadata` の一部として送信されます。このフィールドには、次の制限があります。

* `user_metadata` に含められるフィールド数は 10 個までです
* `user_metadata.field` は文字列である必要があります
* `user_metadata.field.value.length` は 500 文字未満である必要があります
* `user_metadata.field.length` は 100 文字未満である必要があります
* `user_metadata` の現在のサイズ上限は **16 MB** です

<div id="redirect-mode">
  ## リダイレクトモード
</div>

ログインに成功すると、Auth0 は設定済みのコールバックURL に、クエリ文字列内の <Tooltip tip="JSON Web Token（JWT）: 2者間でクレームを安全に表現するために使用される標準的な IDトークン形式（多くの場合、アクセストークン形式でもあります）。" cta="用語集を見る" href="/ja/docs/glossary?term=JWT">JWT</Tooltip> (`id_token`) を付与してユーザーをリダイレクトします。

その後、サーバーで APIv2 を呼び出し、必要なカスタムフィールドをユーザープロファイルに追加する必要があります。

<div id="add-username-to-the-signup-form">
  ## サインアップフォームに username を追加する
</div>

一般的なサインアップのカスタマイズとして、サインアップ時に username を追加できます。

この機能を有効にするには、編集する接続の **Settings** タブにある Dashboard の [Connections > Database](https://manage.auth0.com/#/connections/database/) セクションで、**Requires Username** 設定をオンにします。

カスタムフォームで `username` フィールドを取得し、リクエストボディに `username` を追加します。

<div id="optional-verify-password-strength">
  ## 任意: パスワード強度を確認する
</div>

データベース接続のパスワードポリシーは、Dashboard で設定できます。詳細については、[Auth0 データベース接続の Password Strength](/ja/docs/authenticate/database-connections/password-strength) を参照してください。

カスタムサインアップフォームの実装で必要な場合は、設定されたパスワードポリシーを、ほかの接続情報とともに [Management v2 API](https://auth0.com/docs/api/management/v2#!/Connections/get_connections_by_id) から取得できます。返される結果はクライアント側で解析でき、その接続に対して Dashboard で現在設定されているパスワードポリシー (1 つまたは複数) に関する情報が含まれます。