【Power Platform】PowerAppsキャンバスアプリでAzure OpenAIのChatGPTを呼び出してみた

はじめに

今回はPowerAppsで質問に答えてくれるキャンバスアプリを作成してみたいと思います。
Azure OpenAIのChatGPTを問い合わせ先として、回答をキャンバスアプリに表示する構成を試します。

※Azure OpenAIの環境作成は本稿では割愛します。
　環境作成後にエンドポイントとAPIキーが払い出されるのでこちらをご準備ください。

Azure OpenAIを利用することでMicrosoftクラウド上で完結したセキュアな環境を構築することができ、
権限管理や接続制限、チャット入出力の保存といった様々な対応が可能となります。

また、Azure OpenAIで提供されたデータについてはOpenAI社と切り離され、
Microsoft社のモデルトレーニングやサービス改善にも利用されないことが明言されています。

■Data, privacy, and security for Azure OpenAI Service
https://learn.microsoft.com/en-us/legal/cognitive-services/openai/data-privacy

カスタムコネクタの作成

OpenAI社が提供しているChatGPTは予め用意されているコネクタを利用することで容易に呼び出しが可能ですが、
Azure OpenAI経由で接続する場合はカスタムコネクタを作成する必要があります。

カスタムコネクタのページにて、「一から作成」を選択します。




続く画面でコネクタの名前を設定します。




全般情報の画面にて、スキーマが"HTTPS"であることを確認し、ホスト欄にエンドポイントの情報を入力します。
※エンドポイントは "*****.openai.azure.com" の形式 




セキュリティの画面にて、下記の情報を入力します。

　認証タイプ：API キー 　
　パラメーターのラベル：APIキー 　
　パラメーター名：api-key 　
　パラメーターの場所：ヘッダー

定義の画面にて、新しいアクションを作成します。
概要、説明、操作IDに任意の値を設定します。




要求欄の"サンプルからのインポート"を押下します。
下記のように入力し、"インポート"を押下します。

　動詞：POST 　
　URL：https://*****.openai.azure.com/openai/deployments/*****/chat/completions?api-version=2024-02-15-preview
　ヘッダー：Content-type application/json
　本文：{ "messages": [ { "role": "system", "content": "You are an AI assistant that helps people find information." } ],"temperature": 0.7, "top_p": 0.95, "frequency_penalty": 0, "presence_penalty": 0, "max_tokens": 800, "stop": null}

※URLの部分については下記をご参考ください。
■Azure OpenAI Service の REST API リファレンス
https://learn.microsoft.com/ja-jp/azure/ai-services/openai/reference#completions





ここまで設定したら"コネクタの作成"を押下し、カスタムコネクタを保存します。




再度カスタムコネクタのテスト画面に移り、"新しい接続"を押下します。




APIキーを入力し、接続を作成します。




再度カスタムコネクタのテスト画面に戻り、下記の設定を行い、"テスト操作"を押下します。

　api-version： 2024-02-15-preview　
　Content-type：application/json
　role：user 　
　content：任意の質問

応答が正常に返ってくることを確認します。 ボディをスクロールすると質問に対する回答が返ってきていますね。

キャンバスアプリの作成

続いて先ほどのカスタムコネクタをキャンバスアプリに組み込みます。
キャンバスアプリの作成画面にて、"データの追加"から先ほど作成したカスタムコネクタを選択します。




次に質問の入力、回答の出力が行えるように下記のコンポーネントを追加します。

　テキスト入力：質問の入力用領域 　
　ボタン：質問の送信用ボタン 　
　テキストラベル：回答の出力用領域

ボタンのOnSelectに下記のコードを記載します。

//Azure OpenAIに質問を投げて回答をセット

Set(ans,

    AOAIConnect.AOAIConnectAction(

        {

            'api-version':"2024-02-15-preview",

            'Content-type':"application/json",

            messages:{

                role:"user",

                content:TextInput1.Text

            }

        }

    )

);

次に、テキストラベルに下記のコードを記載します。

Text(First(ans.choices).message.content)

アプリを保存して動作を確認してみましょう。



質問に応じた回答が表示されることを確認出来ましたね。

まとめ

今回はAzure OpenAIを利用するための第一歩として、カスタムコネクタの作成とキャンバスアプリへ組み込む方法を紹介しました。
企業向けにChatGPTを利用するにあたり、セキュリティ面での懸念を解消できる点からAzure OpenAIでの構成がおすすめ出来ると思います。

QUICK E-Solutionsでは、「AIチャットボット構築サービス」をはじめとして、各AIサービスを利用したシステム導入のお手伝いをしております。それ以外でも QESでは様々なアプリケーションの開発・導入を行っております。提供するサービス・ソリューションにつきましては こちら に掲載しております。
システム開発・構築でお困りの問題や弊社が提供するサービス・ソリューションにご興味を抱かれましたら、是非一度 お問い合わせ ください。