日本語
  • gpt
  • oauth
  • openai

GPT アクションでユーザーを認証: 個人用アジェンダアシスタントの構築

GPT 内でユーザーに個別の体験を提供しましょう。このチュートリアルでは、OAuth を使用して個人用アジェンダアシスタント GPT を作成する方法を示します。

Gao
Gao
Founder

GPTs は特定のユースケースに合わせて ChatGPT の体験を深くカスタマイズするのに最適です。さらに良いことに、actions を使用してサービスと直接やり取りすることができます。

このチュートリアルでは、GPT のアクションでユーザーを認証するために OAuth を使用する方法を説明します。ユーザーが GPT 内で自分のイベントを管理できる個人用アジェンダアシスタントを構築します。

最終的な GPT は以下のようになります:

左側はユーザーの GPT とのインタラクションで、右側はユーザーのアジェンダを表示する Web アプリです。このアプローチには他の可能性もあり、例えば:

  • ユーザーがメールやニュースを消化するのを助けるパーソナルアシスタントを作成する。
  • 会話を離れずにフライトを検索して予約する GPT を作成する。

このチュートリアルの結果とリソース:

  • 最終的な GPT は ChatGPT で利用可能です。
  • デモ Web アプリは gpt-agenda.fordemo.app で利用可能です。
  • 完全なコードは GitHub で入手できます。

前提条件

  • 現在のところ、GPT は ChatGPT Plus およびそれ以上のユーザーのみに提供されています。
  • Logto Cloud テナント。お持ちでない場合はサインアップして無料でご利用いただけます。
  • 制御可能なドメイン。これを GPT と Logto Cloud の両方に使用します。
  • REST API を公開できる Web アプリ。このチュートリアルでは、事前に構築されたアジェンダアプリを使用します。

GPT の作成と設定

GPT の作成

  1. ChatGPT を開いて、左側で GPT を探索 ボタンをクリックし、右上の 作成 ボタンをクリックします。
  2. 新しい GPT ページで、GPT の名前と説明を入力します。例えば、アジェンダアシスタント や 会話内で直接アジェンダを管理します などです。
  3. 必要に応じて、プラスアイコンをクリックして GPT のロゴをアップロードするか、DALL-E を使って生成してください。

アクションの作成

下部の 新しいアクションを作成 ボタンをクリックします。新しいページには 3 つのセクションがあります:

  • 認証: ユーザーがアクションに対してどのように認証を行うかを設定するセクションです。今のところ なし に設定します。
  • スキーマ: アクションの REST API を定義する YAML 形式の OpenAPI スキーマ。このスキーマが詳細であるほど、GPT はユーザーの意図をよりよく理解できます。
  • プライバシーポリシー: アクションのプライバシーポリシー URL。

このチュートリアルでは、ユーザーのアジェンダを管理するための REST API を公開する事前構築されたアジェンダアプリを用意しています。OpenAPI スキーマは GitHub リポジトリ にあります。

スキーマを貼り付けると、GPT は自動的にエンドポイントを認識し、テーブルを生成します。テスト ボタンをクリックしてエンドポイントをテストできます。

アクションを追加

GPT は API 呼び出しを行うための許可を求めます。許可 または 常に許可 ボタンをクリックして続行します。

アクションをテスト

エンドポイントが認証を必要とする場合、上記のようなエラーメッセージが表示されます。サーバーログを確認すると、GPT が認証情報なしでリクエストを送信していることがわかります。

アクションテストエラー


認証なしの API コール

Logto Cloud でカスタムドメインを設定する

ChatGPT では、アクションと認証エンドポイントが同じルートドメインにある必要があります。例えば、アクションエンドポイントが https://api.example.com/ の場合、認証エンドポイントは https://auth.example.com/ のようにならなければなりません。

この要件に従うためには、Logto Cloud でカスタムドメインを設定する必要があります。Logto Cloud にサインインした後、左側の 設定 タブをクリックし、上部の ドメイン タブをクリックします。

通常、設定を完了するのに数分しかかかりません。完了すると、カスタムドメインが 使用中 になるのが見えるはずです。

カスタムドメイン

Logto Cloud でアプリを作成する

OAuth 認証を行うためには、Logto Cloud でアプリを作成する必要があります。Logto Cloud にサインインした後、左側の アプリケーション タブをクリックし、右上の アプリケーションを作成する ボタンをクリックします。

新しいページで、「フレームワークなしでアプリを作成」 をクリックします。アプリケーションタイプとして「従来の Web」を選択し、アプリ名を入力します。例として GPT アジェンダアシスタント です。そして、「アプリケーションを作成」 をクリックします。

アプリが作成されたら、エンドポイント & クレデンシャル カードにナビゲートします (少しスクロールする必要があるかもしれません)。エンドポイントの詳細を表示 をクリックして情報を展開します。

Logto アプリ設定

アクションを設定する

今度は、GPT アクションページに戻り、認証 セクションをクリックし、OAuth を選択します。フォーム項目は Logto Cloud の情報と次のように一致します:

  • クライアント ID: Logto Cloud の アプリ ID。
  • クライアントシークレット: Logto Cloud の アプリシークレット。
  • 認可 URL: Logto Cloud の 認可エンドポイント。
  • トークン URL: Logto Cloud の トークンエンドポイント。

スコープ フィールドには openid offline_access を入力し、「トークン交換方法」 フィールドのデフォルト値 (POST リクエスト) を保持してください。

GPT アクション認証設定

最後に、下部の 保存 ボタンをクリックします。

Logto アプリ構成を更新する

GPT 構成ページに戻ると、アクション セクションの下に コールバック URL フィールドが表示されるはずです。

その URL をコピーし、Logto Cloud アプリページに戻ります。URL を リダイレクト URI セクションに貼り付けます。

Logto アプリリダイレクト URI

次に、下にスクロールして、常にリフレッシュトークンを発行 をオンにして GPT のリフレッシュトークンサポートを有効にします。これにより、ユーザーは GPT に長くサインインしたままになることができます。

その後、下部の 保存 ボタンをクリックします。

チェックポイント: OAuth フローをテストする

これで準備が整ったので、期待通りにすべてが機能するかを確認するために OAuth フローをテストします。GPT 設定ページに戻り、作成したアクションをクリックし、次に listItems エンドポイント (最初のもの) の テスト ボタンをクリックします。

プレビューセクションでサインインを促されます。[あなたのアクション名] でサインイン** ボタンをクリックし、OAuth フローを完了します。

サインインプロンプトをテスト

サインインの体験は、Logto Cloud でブランディングやサインイン方法などをカスタマイズできます。詳細については、🎨 サインイン体験のカスタマイズ を参照してください。

すべてが期待通りに動作している場合、バックエンドサーバーは Authorization ヘッダーにアクセストークンが含まれるリクエストを受け取るはずです。この場合、バックエンドサーバーはアジェンダアプリです。応答本文でユーザーのアジェンダを返します:

API 成功をテスト

驚くべきことに、OpenAPI スキーマが詳細であるため、GPT は追加の設定なしで API 呼び出しを実行できます。例えば、createItems エンドポイントの テスト ボタンをクリックすると、GPT がリクエストボディを生成するのを確認できます (または、GPT の気分次第で不足情報を提供するようお願いされることもあります)。

API 作成をテスト

アクセストークンの検証

OAuth フローが動作しているので、バックエンドサービスでアクセストークンを検証して、リクエストが認証されたユーザーから来ていることを確認できます。Logto は OIDC プロバイダーであるため、アクセストークンを検証するために Userinfo エンドポイント を使用できます。このエンドポイントは Logto Cloud アプリページにあります。

アクセストークンを Authorization ヘッダーに含めて、エンドポイントに GET リクエストを送信するだけです。アクセストークンが有効であれば、エンドポイントは応答本文にユーザー情報を返します。Node.js を使用した例を以下に示します:

完全なコードは GitHub リポジトリ で見つけることができます。

ボーナス: メインアプリとのリアルタイム同期

独自のアジェンダアプリを持っている場合、認証を使用して、会話を離れることなくユーザーのアジェンダをリアルタイムで同期できます。リアルタイム同期を実際に見たい場合は、web app にアクセスし、デモ GPT](https://chat.openai.com/g/g-gThGKWoMB-agenda-assistant-by-logto) で使用したのと同じアカウントでサインインしてください。

結論

GPT アクションは、ユーザーにパーソナライズされた体験を提供するための強力なツールです。ご質問やご意見がある場合は、ぜひ私たちの Discord サーバー で話し合いに参加してください。

Logto Cloud を無料で試してみてください