【B2C Service】BUI 拡張機能 – OAuth 認証フローによるトークン生成
BUI Extension – Token Generation via OAuth Authentication Flow
まとめ:
この投稿では、認証フローを開始し、認証コードを一時的に保存し、外部オブジェクトを使用して OAuth トークンを生成する例を示します。
コンテンツ:
init.js – BUIで拡張機能を読み込むために使用します。この例では、BUIのヘッダーにメニューを作成します。
index.html – これはコンソール拡張機能であるため、index.html には拡張機能の UI が含まれています。この例では、API Gateway からの出力とデコードされた JWT トークンがこのファイルに表示されます。
index_init.js – ダイアログ ウィンドウを読み込み、アイデンティティ プロバイダーへの OAuth 認証フローを開始し、コールバックから認証コードをインターセプトし、外部オブジェクトを使用して実際のベアラー トークンを生成し、API ゲートウェイを呼び出し、最後にデモンストレーションの目的で結果を index.html に表示するために使用されます。
トークンが生成されたら、それをどのように保存し、取得するかは開発者の責任となります。この例では、トークンはブラウザストレージまたは単一の変数に保存できます。
このインスタンスでは、認証コードからJWTを生成する際にシークレットが漏洩しないよう、外部オブジェクトの使用が推奨されます。この例では、認証コードから生成されたベアラートークンを使用してAPIゲートウェイを呼び出すために、別の外部オブジェクトが使用されています。
外部オブジェクトを利用する拡張機能をインストールする場合、各拡張機能に、呼び出される外部オブジェクトへのアクセス権を与える必要があります。これは、拡張機能マネージャーの「接続権限」タブで設定できます。
以下は、コンソール拡張がトリガーされたときのフローです。
認証フローを開始するダイアログ ウィンドウが開きます。
この場合、BUIへのログインにシングルサインオンが使用されているため、アイデンティティプロバイダーはユーザーが既にログインしていることを認識し、自動的に認証トークンを発行してコールバックスクリプトに送信します。BUIへのログインにシングルサインオンが使用されていない場合は、ダイアログウィンドウがアイデンティティプロバイダーにリダイレクトされ、ユーザーにログインを促します。このコールバック(この場合はカスタムPHPスクリプト)は、URLのクエリパラメータから認証コードを取得し、ブラウザのセッションストレージに一時的に保存します。
2. セッションストレージで認証コードが認識されると、外部オブジェクトは認証トークンを使用してアイデンティティプロバイダーを呼び出し、ベアラートークンを生成します。最後に、認証コードはセッションストレージから削除されます。
拡張機能を使用して拡張または変更するには、以下のコードを添付します。
※ソースコードは元記事である下記リンク先より取得してください
BUI Extension – Token Generation via OAuth Authentication Flow