もくじ
https://tera1707.com/entry/2022/02/06/144447

やりたいこと

前回、github modelsのAIモデルサービスを使って、チャットクライアントを作ってみた。

今回は、Azure OpenAIのAIモデルサービスを使って、チャットクライアントを作りたい。

まずは、下記のVisualStudioのAIアプリテンプレートを使って、サービスの契約と設定がうまくいくところまでをやってみる。

テンプレートを置いてある、このページの説明に沿ってやっていく。

アプリのテンプレはgithub modelsの時にインストール済み。

上のページの「サンプルアプリを調べる」までは前回同じなので、そこまでskipする。

skipして、Azure OpenAI サービスを作成して認証するの項目以降をやる。

やったこと

Azure OpenAI関連アカウント作成・モデルのデプロイなどの設定をする

Azure OpenAI サービスを作成して認証するの内容のここを押すと、

ここに飛ぶ。

さらにここを押すと、

ここに飛ぶ。

今回は、私はマイクロソフトアカウントを作成済みなので、右上の「サインイン」ボタンを押して、ログインする。（マイクロソフトアカウントは事前に作っておく）

ログインすると、ここに飛ぶ。

そこの「リソースの追加」を押す。
押すと、リソースを選ぶ画面に行くので、「Azure OpenAI」を押す。

飛んで、「サブスクリプション」のところを選ぶと、「使用できる項目がありません」と出た。

これは、AzureOpenAIのリソースが使えるサブスクリプションに登録していないということと思われる。

サブスクリプションは、要は、料金プランってことか（無料プランも多分含む）。

なので、さっき出てきたこのページに戻って、

無料でまずは試したいので👇を押す。

私の場合は、すでに以前、Azureアカウントを作成したようで、こういう画面になった。
（ここで気づいたが、今ログインしようとしたのはAzureアカウントで、さっき上の方でログインしたのはマイクロソフトアカウント、なのか？）

たぶん、Blazorのアプリを作りたかったときに、Azure App Serviceの実験用にAzureアカウント作った奴があったんだと思われる。

Azureアカウントが無い場合は作成必要。作成時、名前などの登録と一緒に、クレジットカードの登録が必要。

で、「お使いのアカウントの既存のサブスクリプションを使用して下さい」を押すと👇になった。アップグレードはしたくないのだが、仕方ないので「アカウントのアップグレード」を押す。
※まだ200ドル分の無料枠が残っているらしいので、それで何とか実験し切りたい

※次に、追加のサービス？のようなものを選ぶ画面が出てきたのだが、画面取るのを忘れた。一番下に出ていた無料の分を選択。

次に進むと、こういう画面になった。まだ0JPYらしい。

いくら使っているのか、は👇から見れるっぽい。要チェック

今契約したサブスクリプションは、下記から見れる様子。

ここまでやると、先ほどのAzure OpenAIのリソースの作成まで戻ると、サブスクリプションが表示された。

「リソースグループ」という欄が、必須だったので、新規作成を押して、グループを作った。

その他項目も、下記のように入力した。

Pricing Tierは「Standard S0」になっている。

料金表によると、「Standard」は従量課金という意味らしい。（コンボボックスに他の選択肢はない。）
先ほど契約したサブスクリプションは従量課金だったので、これを選ぶ。

ここまで入れたら、画面下のほうにある「次へ」を押す。

とりあえず、一番上にした。あとでちゃんとせっていしたほうがよさそう。

次に行くと、「タグ」を入力せよとのこと。また何に使うものなのかわからないので仮の値にする。
1個だけつくる。

確認画面がでるので、「作成」を押す。

作成を押すと、「デプロイ」がされる。こういう表示になる。

デプロイが完了すると、「リソースに移動」ボタンが出てきたのでそれで移動する。

リソースを見ると、「Endpoints」や「キー」という項目がある。

Aiチャットクライアントのコードの中に、Endpointやらキーやらを使ってる個所があったので、たぶんここで見ることができるEndpointやキーを使って、チャットクライアントにアクセスするものだと思われる。

Endpointsかキーの管理、を押すと、下のような画面になった。（どっちでも同じ画面に飛んだ）
ここで、各値を見れた。

あとは、コードを書いて、キーやEndpointにアクセスすればよいと思われる。
コードの方に移動する。

一旦戻る。

ここの内容に沿って、「モデル」をデプロイしないといけないらしい。
モデル：gpt-4o-mini とかそういうの。

Azure AI Foundryのポータルに移動する。

さっき作ったリソースが出てるので、それを押す。

ここを押す。

モデルのデプロイを押して、「基本モデルのデプロイ」を押す。

モデルの選択画面が出てくるので、今回はgpt-4o-miniとtext-embedding-3-smallモデルを選ぶ。
（VisualStudioのAIアプリテンプレートがそれを使っているため）

こういう画面が出てくるので、グローバル標準を選んで、「デプロイ」を押す。

※下のページに、まずはGlobal標準をお勧めします、とあったので。

同じようにして、text-embedding-3-smallも追加する。

VisualStudioのAIアプリテンプレートを動かす

VisualStudioで、テンプレートで作成したアプリを開く。

vsのオプション画面の「Azureサービス認証」の「アカウントの選択」で、VSが使っているアカウントが、azureに登録したアカウントと同じであることを確認する。
（このアカウントから、開発用として、さっき登録したAzureOpenAIのリソースにアクセスするらしい。）
（これから使おうとしているテンプレートがそういう作りになっているだけなのかも？未確認だが、とりあえず言われたとおりにする。）

※追記：おそらく、この操作は、VisualStudioで開発中は、OpenAIのキー（Token）を使わなくても、AIClientが使えるようにするための操作だと思う。なので、今回は、下の方でコードの中にキーを入れているので、この操作をしなくても動くと思う。（後で、逆に、キーを書かなくても開発中は動かせる方法を調べなおしたい。(今回それがうまくいかなかった)）

※私の場合、上の図の「アカウントの選択」表示の下あたりに「アカウントを再確認してください」みたいな表示がでており、それが出ている状態でテンプレを実行したら、認証がどうとかでエラーが出た。（画面は取れず）

そこまでやって、テンプレートアプリを実行したら、ブラウザでこの画面が出た。

が、そのまま実行して、チャットを入力すると、下図のようなエラーになった。
なぜか調べる。

こういうエラーだった。

権限ないよ系っぽい。

コードを少し変えて、エンドポイントのキーを入れてやると、動くようになった。（赤枠の中に、キーを書いてる）

使ったキーは、下図の「キー１」。

開発者用に、キー要らないようにする方法もちゃんと調べたいが、とりあえずキーを入れる形で動かすことはできた。

※認証周りについて、かずきさんのサンプルのこの辺、参考になるかもしれない。

このサンプルでは、CLIクレデンシャル、というのを使っている様子。後ほど見てみる。

ここから下は不要な手順っぽい

ここから下は、いろいろ試す中でメモした内容だが、動くようになるまでにはおそらく不要だった操作。
消そうと思ったが、なにかの手がかりになるかもしれないので一応置いておく。

VSテンプレートのreadmeをみると、下記のように書いてある。

その設定をしてみる。
Azureのポータルで、「アクセス制御（IAM）」→「追加」の横のこれを押し、「ロールの割り当ての追加」を押す。

「ロール」画面で、「Azure Ai Developer」を検索し、出てきたそれをクリックする。

「メンバー」画面で、ロールが「Azure AI Developer」になっているのを確認し、「メンバーを選択する」を押す。

メンバー選択欄が出てくるので、そこで先ほど登録したアカウントを選び、「選択」を押す。
で、「レビューと割り当て」を押す。

先ほどのロール割り当て画面に、今設定した「Azure AI Developer」に自分が割り当てられた表示が出る。

...てな感じでいろいろ試したが、どうにもうまくいかなかったので、結局、こーどの中に、キー（Token）を埋め込んで認証させてしまった。後追いで、開発中にVSから実行はキー無しで出来るようにする方法、調べること。

参考

Github Modelsで、VisualStudioのAIアプリテンプレートを動かしてみたときの記事

前回の、Github ModelsのAIモデルサービスで、AIチャットクライアントを作ったときの記事
(AIチャットクライアント(C#)を作って、そこでMCPクライアント/サーバー(C#)を使う)