Universal Portals Quickstart

Auth0 CLI、Auth0 Agent Skills、またはAuth0 Dashboardを使用して、初めてのポータルを設定する方法を説明します。

ポータルは、以下の方法で作成できます。

• Auth0 CLI を使用して、1 つのコマンドでアプリケーションとポータルをプロビジョニングおよび設定する。
• Auth0 Agent Skills を使用して、お好みの AI アシスタントにアプリケーションとポータルのプロビジョニングおよび設定を依頼する。
• Auth0 Dashboard を使用して、手順に沿ってアプリケーションとポータルを作成する。

​

前提条件

• Universal Portals ベータ版へのアクセスがプロビジョニングされている Development Auth0 テナント。

Auth0 CLI

​

ステップ1: Auth0 CLI Beta をインストールする

お使いのプラットフォーム用のインストール手順に従ってインストールし、tenantで認証します。

auth0-beta login

​

ステップ2：設定コマンドを実行する

auth0-beta universal-portals setup

別名 auth0-beta up setup も使用できます。Auth0 CLI コマンドにより、次の項目が作成されます。

• My Account API: ユーザーアカウント操作用のリソースサーバー
• My Organization API: 組織管理操作用のリソースサーバー
• A Regular Web App: ポータルにリンクされたアプリケーション
• 3 つのクライアントグラント: My Account、My Organization、Management API 操作へのスコープが設定されたアクセス
• ポータル: デフォルトのテンプレートで事前設定され、すぐにテストを開始できます

コマンドが完了すると、ポータルの URL が出力されます。ブラウザーで開いてポータルをテストしてください。

Auth0 Agent Skills

​

ステップ 1: Auth0 Agent Skills をインストールする

npx skills add auth0/agent-skills

​

ステップ2：AI agent に Universal Portals の設定を依頼する

Auth0 テナントで Universal Portals を設定する

AI agent により、以下が作成されます。

• My Account API: ユーザーアカウント操作用のリソースサーバー
• My Organization API: organization 管理操作用のリソースサーバー
• 通常の Web アプリ: ポータルにリンクされたアプリケーション
• 3 つのクライアントグラント: My Account、My Organization、Management API 操作へのスコープが設定されたアクセス
• ポータル: すぐにテストを開始できるよう、デフォルトのテンプレートが事前設定されています

コマンドが完了すると、ポータルの URL が出力されます。ブラウザーで URL を開いて、ポータルをテストしてください。

詳細については、Auth0 Agent Skills を参照してください。

Auth0 Dashboard

​

ステップ1: 従来型Webアプリケーションを作成する

1. Auth0 Dashboard > アプリケーション > アプリケーションに移動し、Create Application を選択します。
2. 従来型Webアプリケーション を選択し、名前を付けます。
3. Create を選択します。

​

ステップ2: アプリケーションを設定する

アプリケーションの 設定 タブで、次の操作を行います。

1. Allowed Callback URLs に https://YOUR_AUTH0_DOMAIN/portals/auth/callback を、Allowed Logout URLs に https://YOUR_AUTH0_DOMAIN/portals/YOUR_PORTAL_SLUG を設定します。

2. Advanced Settings > Grant Types までスクロールし、次の項目を有効にします。

   • 認可コード
   • リフレッシュトークン
   • Client Credentials
   • MFA

3. 変更を保存 を選択します。

​

ステップ3: API アクセスを設定する

アプリケーションの API Access タブで、次の API とそのスコープを有効にします。

My Account API (https://YOUR_AUTH0_DOMAIN/me/) ユーザー委譲アクセス:

スコープ	説明
create:me:authentication_methods	認証方法を登録する
read:me:authentication_methods	認証方法を一覧表示する
update:me:authentication_methods	認証方法を更新する
delete:me:authentication_methods	認証方法を削除する
read:me:factors	利用可能な MFA 認証要素を読み取る

My Organization API (https://YOUR_AUTH0_DOMAIN/my-org/) ユーザー委譲アクセス:

スコープ	説明
read:my_org:configuration	organization の設定を読み取る
read:my_org:details	organization の詳細を読み取る
update:my_org:details	organization の詳細を更新する

Auth0 Management API クライアントアクセス:

スコープ	説明
read:branding	tenant のブランディング設定とテーマを読み取る
read:organizations	organization のブランディング設定を読み取る

各 API を有効にした後、Save を選択します。

​

ステップ4: Multi-Resource Refresh Token を有効にする

設定 タブに戻り、Multi-Resource Refresh Token までスクロールします。ステップ3で設定したユーザー委譲 API とスコープ (My Account API および My Organization API) に対して有効にします。

変更を保存 を選択します。

​

ステップ5: ポータルを作成する

1. Auth0 Dashboard のサイドバーから Portals を選択します。

2. Create Portal を選択します。
3. ポータルの Name と Slug を入力します。スラッグはポータル URL の一部になります。

4. Create を選択します。
5. ポータル設定で、ステップ1で作成したアプリケーションをリンクします。

ステップ2でコールバック URL とログアウト URL をまだ設定していない場合は、ポータル設定からコピーしてアプリケーションに設定します。

​

ステップ6: ページを作成する

ポータルの作成後、ビジュアルエディターが開きます。左側のパネルからコンポーネントをキャンバスにドラッグして、ページを構成します。

​

ステップ7: プレビューして公開する

Preview を選択すると、新しいタブでポータルが開きます。準備ができたら、Publish を選択します。

​

詳細情報

Universal Portals の概要

Universal Portals のユースケース、仕組み、主な機能について説明します。

Universal Components

ポータルで使用する Universal Components ライブラリについて説明します。

Auth0 フォーム

ポータルでプロファイルの更新、ポリシーへの同意、マーケティングコミュニケーションの設定など、エンドユーザーから情報を収集するためのフォームについて説明します。