Skip to main content
Auth0 の Vercel ネイティブ連携を使うと、最小限の設定で ID プラットフォームを Vercel プロジェクトに接続できます。ゼロから構築しなくても、ログイン画面を設定してカスタマイズできます。さらに、B2B Organizations、Fine-Grained Authorization (FGA)、Auth0 for AI Agents などの高度な機能を利用して、認証フローと認可フローを拡張し、スケールできます。 Auth0 の Vercel ネイティブ連携では、次のことが可能です。
  • Vercel プロジェクトに接続する Auth0 アプリケーションを自動的にプロビジョニングする。
  • すばやく簡単に設定できるよう、Auth0 の資格情報を Vercel Dashboard に事前入力する。
  • Auth0 SDKs を使用する Next.js アプリケーションを標準でサポートする。
Auth0 の Vercel ネイティブ連携では、Vercel プロジェクト用に新しい Auth0 テナント環境が作成されます。既存の Auth0 アカウントを使用したい場合は、Auth0 Dashboard でアプリケーションを作成する際に、Vercel と手動で連携してください。

​
前提条件

始める前に、以下を用意してください。 連携をインストールしたら、Vercel の要件に従って Universal Login または Classic Login を iframe 内で読み込めるように、Iframe 埋め込みを有効にします。

​
連携をインストール

Vercel Marketplace から Auth0 の Vercel ネイティブ連携をインストールします。
  1. Integrations > Browse Marketplace に移動して Auth0 を検索します。Native Integrations の Auth0 integration を選択し、Install を選択します。
  2. Auth0 により、アプリケーションの localhost URL と callback URL が自動入力されます。Installation Plan を選択し、Continue を選択します。
  3. アプリケーション名を入力します。Create を選択します。新しい Auth0 テナントとアプリケーションが正常に作成されたら、Continue を選択します。
  4. 既存の Vercel プロジェクトに接続するには、Connect Project を選択し、プロジェクトと環境を選択します。必要に応じて、環境変数に追加するカスタムプレフィックスを入力します。Connect を選択します。Vercel プロジェクトの接続が完了すると、連携の Getting Started セクションに移動します。

​
Getting started

Vercel Dashboard の Getting started セクションには、アプリをすばやく安全に使い始めるための Quickstart が表示されます。左側のナビゲーションから、Application Settings を管理することもできます。

​
Quickstart

Auth0 の Vercel ネイティブ連携を使い始めるには、Vercel Dashboard の手順に従ってアプリケーションを作成し、デプロイします。
Auth0 の環境変数は本番環境でのみ設定できます。

​
アプリケーション設定の管理

アプリケーションの設定は、Vercel Dashboard と Auth0 Dashboard で管理できます。

​
Vercel Dashboard

Vercel Dashboardでアプリケーション設定を管理するには、左側のナビゲーションにある設定に移動します。 次のアプリケーション設定を更新できます。
  • 名前の更新: アプリケーションの名前を更新します。
  • Configurationの更新:
    • Parameters: アプリケーションのローカルホスト URL とコールバックエンドポイントを更新します。
    • 現在のインストールレベルプラン: 連携のインストールレベルプランを更新するには、連携設定に移動します。詳しくは、設定を参照してください。
  • このリソースの保護
    • シークレットのローテーション: アプリケーションのシークレットをローテーションします。詳しくは、Rotating environment variablesを参照してください。
    • 許可する環境: 連携をすべての環境で利用可能にするか、本番環境のみで利用可能にするかを選択します。
  • 連携を削除: 連携を削除すると、自動的に Vercel の Free プランにダウングレードされます。詳しくは、Delete integrationを参照してください。

​
Auth0 Dashboard

Auth0 Dashboard で、追加のアプリケーション設定を管理できます。 ネイティブ連携をインストールすると、Auth0 は専用のテナント内に新しいアプリケーションを作成し、Vercel の URI、許可されたコールバック URL、ログアウト URL をあらかじめ設定します。 このアプリケーションは、Universal Login のエクスペリエンスのカスタマイズなど、Auth0 Dashboard 内の他のアプリケーションと同じように変更できます。

​
連携の管理

Vercel Dashboard で連携を管理するには、プロジェクトの Integration タブを選択し、Auth0 連携までスクロールして Manage を選択します。

​
請求書

Invoices ページでは、Auth0 連携に関連する請求書の一覧を確認できます。請求書について詳しくは、Billing & Invoices をご覧ください。

​
設定

設定ページでは、支払い方法の追加、インストールレベルのプランの変更、連携の削除ができます。

​
支払い方法

支払い方法を追加するには、追加を選択します。支払い方法について詳しくは、Vercel の料金をご覧ください。

​
現在のインストールレベルのプラン

インストールレベルのプランは、インストール内のすべての製品に適用されます。 インストールレベルのプランを変更するには:
  1. 設定 で 現在のインストールレベルプラン までスクロールし、Change Plan を選択します。
  2. 希望するインストールレベルのプランを選択します。
  3. Continue を選択します。
  4. 選択内容を確認して、Update を選択します。
  5. インストールの更新が完了したら、Done を選択します。

​
連携を削除

連携を削除すると、自動的に Vercel の Free プランにダウングレードされます。 連携を削除するには、次の手順に従います。
  1. 設定 で Delete <YOUR_PRODUCT> までスクロールし、Remove <YOUR_PRODUCT> ボタンを選択します。
  2. 連携スラッグとチームを入力し、I acknowledge that this will remove my Auth0-connected account を選択します。
  3. Remove <YOUR_PRODUCT> を選択します。