Microsoft - AzureChatGPTをCloneしてオリジナルChatgptを作っちゃおう - ①とにかく使ってみる編(失敗します) - 8/5

# はじめに
★★更新：【<https://qiita.com/kazuya-ho2/items/0d03d2fed8fa389faeb7>】
　このシリーズの②で正常に動作がローカルでできているので、そちらを参照くださいませ！

皆さんこんにちは。
Kazuyaです。
Microsoftから、github にて、chatgptの内部構成までを公開するような形で公開されました。
https://github.com/microsoft/azurechatgpt

*************************************************************
### この投稿は、以下の連載です。
①でDevOpsを用いて楽に環境をと思ったところ、Pipelineにミスがあるようで（多分Envilonment系）、デプロイ後に動確すると、AppServiceのURLをたたいてもエラー。
②では、ローカルで実行するとうまくいきました👌

【連載】

https://qiita.com/kazuya-ho2/items/b45054a33c2981b2b79d

https://qiita.com/kazuya-ho2/items/0d03d2fed8fa389faeb7

https://qiita.com/kazuya-ho2/items/78371596a202eda07319

*************************************************************

私が以前から作りたかった「エンタープライズでも使えるChatgpt」というのが、まさしくこれ。
どうしても企業内で使うために越えなければいけないのが、「セキュリティポリシーの壁」。
これを超えるためには、「閉塞空間」やそれに応じたポリシー、担保が必要なのです。

### 公式で言う利点
> 1. プライベート:データのプライバシーに関する保証が組み込まれており、OpenAI によって運用される保証から完全に分離されています。
>2. 制御:ネットワーク トラフィックをネットワークから完全に分離でき、その他のエンタープライズ グレードのセキュリティ制御が組み込まれています。
>3. 価値:独自の内部データ ソース (プラグ アンド プレイ) で追加のビジネス価値を提供するか、プラグインを使用して内部サービス (ServiceNow など) と統合します。

僕のやりたいことをかなえてくれる一歩目になる部分がこの公開になってくると期待。
実装をしながら書いていきますので、右往左往した部分も書いていきます。

# この連載のゴール
１．「とにかく使ってみる」　←今回はここ
２．「ローカルで実行」
３．セキュアな環境とベクトルＤＢの利用＋どこまでセキュアなのかの考察

# 前提
・Azureのサブスクリプションを持っていること
・AzureのOpenAIの利用申請を行い、GPT3.5 または GPT-4.0が使えるようになっていること。
※githubのREADMEにも以下の記載がありますね。
> Azure OpenAI : Azure で ChatGPT をデプロイして実行するには、Azure OpenAI サービスにアクセスできる >Azure サブスクリプションが必要です。こちらからアクセスをリクエストしてください。アクセスできたら、このリンクの手順に従ってgpt-35-turbo または gpt-4 モデルを展開します。
> 認証用に GitHub または Azure AD をセットアップする:以下のID プロバイダーの追加セクションでは、認証プロバイダーを構成する方法を示します。

# １．とりあえず楽にデプロイできる、「デプロイ」の機能が用意されているので、やってみる。
Githubにある「Deploy to Azure」をクリックしちゃえば、DevOpsから必要なリソースが出来上がりそうです。

## やってみちゃいましょう。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2242133/b6ff0c02-0c18-b7b2-0ebd-21f6cae58e97.png)

## 押してみた。
以下のような画面が出ます。
リソースグループは新規作成を押して「azurechatgpt」としました。
リージョンは、japaneastのまま。
名前も、「azurechatgpt」。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2242133/2e8a4843-c873-d7ea-6310-d9d1aa01ddbe.png)

ここで登場。「Openai Api Key」
ここが、前提にも記載している通り、Azure OpenAIをデプロイ済みにしている必要があるのです。
なので、作成済みのAzureOpenAIリソースを開きます。

開いて、リソース管理の「キーとエンドポイント」をクリックすると以下のように表示されるのでこの値を使っていきます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2242133/32a99600-1863-d41e-f183-a1ba9533d78a.png)

続いて、デプロイ名も後で必要になるので、AzureOpenAIのモデルとデプロイをクリック。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2242133/37a67b7f-b6f0-b168-0324-e4dc7597a8b8.png)

「展開の管理」をクリックすると、専用のモデル管理用画面が開く。
まだ作成していなければ「新しいデプロイの作成」からモデルを作成する。
ここで選べるのは、前提にある通り、申請が通っているモデルのみが使える。
以下の例では、gpt3.5を使う。デプロイ名は自分で決めた「gpt35」となる。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2242133/91e94963-1b19-1c26-779a-475b4c920461.png)


カスタムデプロイのページに戻って、以下のように入れていきます。
・Open Api Key：上のAzureOpenAIの、キーとエンドポイントのキー１の値をコピーして貼り付け
・Openai Instance Name：上のAzureOpenAIのリソース名
・OpenAI Deployment Name：上記で確認したデプロイ名（この例では「gpt35」）
・Openai Api Version：2023-03-15-preview（Githubを参考に08/05時点の最新を入れてみる）

これでＯＫ。最終的な形はこんな感じ。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2242133/60c4871c-0207-3110-1120-8832f3eecc7e.png)

## デプロイしてみる。
上記状態で「次へ」を押すと、作成確認の画面が出る。
問題なければ、「作成」をクリック。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2242133/23e3c8c0-334a-c3af-530a-5ef5225387f4.png)

しばらく待ってみる。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2242133/458601c4-2655-514a-8a82-e2d6a818395d.png)

（リアルタイムに書いているので、待ち時間も書いておく）
18:32開始。
2分経過。まだ実行中。
4分経過。終わった！結構早い。

## リソースに移動していざ使えるのか確認してみる。

以下のようにリソースグループが出てくるので、リソースグループに移動をクリック。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2242133/bb0d157b-7de4-2582-2903-79d94b1919f3.png)

移動したら３つのリソースが、作成したリソースグループに作られていることがわかる。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2242133/5406d8f6-e3ac-5c8b-b2ff-6332aafdf769.png)


このうち、実際のＷｅｂアプリは「App Service」。
CosmosDBもあるので、これはおそらく内部的なPromptの履歴などなどの管理でしょう。
WebサイトのURLを確認したいので「App Service」を開く。
ここにある「既定のドメイン」がこのアプリに割り当てられたURL。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2242133/001dd13d-e700-2973-1d22-fa5dccbd5160.png)

開いてい見る。
おっと残念。認証エラーが出ましたね。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2242133/ca1b2c24-0c73-d0a2-8b97-cd7ba5a45317.png)

Githubを見ると、「環境変数」と「認証用IDプロバイダ」が必要との記載がありました。
ここをやっていきましょう。

## 認証用IDプロバイダ構築(Github)

## <font color="HotPink">【重要】認証用IDプロバイダ構築(Github)は失敗に終わります！原因はわかっていないので、成功編だけ見たい方は、認証用IDプロバイダ構築(AzureAD）のほうを見てください。</font>

まず、今回は、AzureADはちょっと手間がかかってしまうので、Githubの認証を使っていきます。
以下を参考に実施していきます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2242133/04f31195-8d3a-e5d5-d144-3fca6cbca911.png)

①【<https://github.com/settings/applications/new】に移動
②上記の画像にある通り、アプリ名など必要な情報を入れていく
ポイント：
・Homepage URL：AppServiceの規定のドメインを設定
・Authorization callback URL：<AppServiceの規定のドメインを設定> + /api/auth/callback/github
※Enable Device Flowはチェックしないで、「Register application」をクリック

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2242133/724e721b-d1e8-0faf-e984-9a667707fec4.png)

### Client IDと Client secretsをメモしておく
上で作成した後遷移した画面にて「Client ID」が表示されているのでメモをしておく
次いで、「Generate a new client secret」をクリックして、シークレットを生成してメモしておく。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2242133/ae51e584-8569-4b9f-a66a-b803afa91647.png)

これでＯＫ。

## App Service側の環境変数に Githubの情報を設定していく
Azure App Serviceの画面に戻って、「構成」を開く。
各種環境変数が並んでいるので、ここに、GITHUBの情報を入れていく。

対象は、以下の変数。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2242133/a4e7a36d-dbaf-82c9-72fd-efa15f0a2e5f.png)

今はこんな感じになっている。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2242133/5f98c27d-0a82-baf7-c744-727f271b0397.png)

ここに、上記の２つを追加していく。
①「New application setting」をクリックして、②・③それぞれの変数を追加する。(Deployment slotにはチェックしない)
② NAME=AUTH_GITHUB_ID、Value=上記のGithub側で取得したClient ID
③ NAME=AUTH_GITHUB_SECRET、Value=上記のGithub側で取得したClient Secret
④ 最後に必ず画面上部の「Save」をクリックして保存する。→Updateが走ってCompleteしたら完了。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2242133/bb0669c5-ffae-3adc-c5d5-07c73e26c794.png)


できた。ここまででガイド通りのことはできたはず。連携できているのかは謎。
さて、再度ＵＲＬをたたいてみる。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2242133/533fb63b-7494-bc7b-0782-274338282a99.png)

うん。当然まだ駄目。理由はわかりきっていて、IDプロバイダ自体を追加していない。
なので、AppServiceの画面に戻って、IDプロバイダを追加していく。

## IDプロバイダの追加
App Serviceのメニューにて、【認証】をクリック。
ID プロバイダーを追加のボタンが出たらクリック。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2242133/f0d5ead3-5109-412f-355f-1d7403fccd6a.png)

Githubを選ぶと以下のようになるので、クライアントID・シークレットはGithub側で作ったものを入れる。
その他はデフォルトのままでＯＫで、追加をクリック。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2242133/e51648a8-9e2f-bb10-0e19-1cb6ca35301f.png)

## いよいよ完了か！？
再度画面を表示してみる。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2242133/1700d31d-d442-6454-1189-466f85f0a86a.png)

ここで失念。。。ログをトレースする根気がないので、潔くAzureADに切り替え。

## 認証用IDプロバイダ構築(AzureAD)
Githubの記載をもとに、AzureADでの構築手順を確認。
同じように、AzureADにアプリを作って、クライアントIDとシークレットを手に入れればよさそう。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2242133/e4814227-3f62-7f8f-dea3-b8543b92b3db.png)

手順は以下。
① 【<https://portal.azure.com/#view/Microsoft_AAD_RegisteredApps/CreateApplicationBlade/quickStartType~/null/isMSAApp~/false>】に移動
② 上記画像を参考に、アプリの情報を入力
　・サポートアカウントの種類：この組織ディレクトリの身に含まれるアカウント

ざっくりこんな感じ
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2242133/d32a419b-9ed9-7b02-fb0f-0a6deb131383.png)

して、登録をクリック。
登録すると画面がポータルに戻ってしまうので、検索キーワード欄に、先ほどのアプリ名を入れて検索。
Azure ADに二つのアプリが存在しているので、アプリケーション側を選んで表示。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2242133/0ce3b5b4-b741-cc18-893d-eadbf8a31183.png)

開いたページの各ページで、以下の情報をメモする。
・クライアントＩＤ：概要ページの、アプリケーション（クライアント）
・テナントＩＤ　　：概要ページの、テナントＩＤ
・シークレット　　：証明書とシークレットのページで、「新しいクライアントシークレット」をクリックして作成したシークレットの「値」（説明等は任意）

これでＯＫ。
この後、App Serviceのページに移動して、構成ページを開き、「Application Settings」のページにて、環境変数に、Azure ADの上記情報を入れていく。

入れ終わった後はこんな感じ。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2242133/1e243385-198a-29c3-020d-51c94863fd78.png)


これで、画面上部の「Save」を押す。

## 再度画面を表示してみる。
だめ。

で、ログを確認したんだけど、内部エラーが出ちゃってる。
調べる手立てが少ないので、これは一度諦めて、ローカルからやり直します。

この後ローカルからの手順を実施しますのでアプデお待ちを！