ARO に OpenAI アプリをデプロイする

# はじめに
OpenAI は様々なアプリで活用されるようになっています。応用できる場面は非常に膨大で、新規アプ開発だけでなく、既存アプリに組み込んでより便利にするケースも多数あります。
この記事では、EC サイトアプリに OpenAI を活用したマイクロサービスアプリを ARO (Azure Red Hat OpenShift) に構築する手順ご紹介します。
EC サイトでは、出品者は新しい商品を EC サイトに掲載する際に、商品の特徴をとらえた説明を追加する必要があります。説明は消費者の目を引くように記載することが望ましいですが、いろいろな商品に対して説明文を作成するのはなかなか大変な作業です。そこで、OpenAI を用いて、商品名やキーワードから説明文を自動作成してしまおう、というわけです。

今回は、下記のドキュメントの内容をベースに ARO に OpenAI 活用 EC サイトを構築します。
[Azure Kubernetes Service (AKS) で OpenAI を使うアプリケーションをデプロイする](https://learn.microsoft.com/ja-jp/azure/aks/open-ai-quickstart?tabs=aoai#deploy-the-application)
ドキュメントのタイトルは AKS となっていますが、利用されている[サンプルアプリ](https://github.com/Azure-Samples/aks-store-demo)は ARO でも活用できます。

# アプリの概要
今回利用するサンプルアプリは次の構成となっています。

<img src="https://github.com/Azure-Samples/aks-store-demo/raw/main/assets/demo-arch-with-openai.png">

図の一番下の ai-service というサービスが OpenAI を活用しています。store-admin が提供する店舗の管理サイトでこの ai-service を呼び出し、商品追加の際に説明文を自動作成する構成です。
store-admin の商品入力画面は下図です。従来はこの画面の説明文 (Description) をすべて入力する必要がありましたが、AI アシストボタン (Ask AI Assistant) が右側に追加されており、このボタンをクリックすることで OpenAI が商品説明を自動作成してくれます。

![スクリーンショット 2023-12-17 161914.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/255074/3b701948-5874-3dd0-7881-2172b5a38ede.png)

その他のサービスの説明は[参照元のドキュメント](https://learn.microsoft.com/ja-jp/azure/aks/open-ai-quickstart?tabs=aoai#deploy-the-application)に記載されているので、そちらをご参照ください。

# アプリ構築の前提
今回構築していくアプリは下記の前提で実施していきます。
* ARO (Azure Red Hat OpenShift) クラスターが構築済み (構築方法は[こちら](https://learn.microsoft.com/ja-jp/azure/openshift/quickstart-portal)を参照ください）
* Azure OpenAI サービスが利用可能
    * 本記事執筆時点 (2023年12月時点) では Azure OpenAI サービスは[サービス利用申請](https://aka.ms/oai/access) が必要となっていますのでご注意ください。（なお、本サンプルアプリは OpenAI 社のサービスも利用可能です、詳しくは元のドキュメントをご参照ください）
* ARO から Azure OpenAI に接続可能
* OpenShift CLI が利用可能

## ARO と Azure OpenAI のプライベート接続
ARO は Azure の仮想ネットワークに構築されますので、他の Azure やオンプレミスで稼働するサービスとプライベートなネットワークを通じて連携することができます。このため、Azure OpenAI サービスと ARO とのプライベート接続が可能です。これは機密度の高いアプリやデータを取り扱いたい場合には必須の構成となります。OpenAI 社のサービスを直接利用する場合はインターネット経由となる点をご注意ください。


![スクリーンショット 2023-12-17 165202.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/255074/92e40596-7d5d-10e6-25fa-c9617e49b628.png)

# アプリの構築
ここからアプリの構築手順をご説明します。

## (1) ARO クラスターへの接続
構築作業は主に OpenShift のコマンドツールである oc コマンドを利用して作業を実施していきます。そこで、oc コマンドで ARO への接続を実施してください。
コンソール右上のメニューから「ログインコマンドのコピー」を選択して oc クライアントがインストールされた環境から接続するか、OpenShift の [Web Terminal](https://access.redhat.com/documentation/ja-jp/openshift_container_platform/4.13/html/web_console/web-terminal) を利用ください。

## (2) EC サイトのアプリを yaml を用いてデプロイ
ai-service を除く EC サイトのサービス群を [yaml マニフェスト](https://github.com/Azure-Samples/aks-store-demo/blob/main/aks-store-all-in-one.yaml) から一括デプロイできるようになっていますので、下記のコマンドをコンソールから実行してデプロイしてください。最初にプロジェクト名`oaidemo`として namespace を作成して切り替えていますが、プロジェクト名は好みの名前に変更可能です。

``` console
oc create ns oaidemo
oc project oaidemo
```
``` console
oc apply -f https://raw.githubusercontent.com/Azure-Samples/aks-store-demo/main/aks-store-all-in-one.yaml
```
下記が出力結果の例です。
```
deployment.apps/mongodb created
service/mongodb created
deployment.apps/rabbitmq created
service/rabbitmq created
deployment.apps/order-service created
service/order-service created
deployment.apps/makeline-service created
service/makeline-service created
deployment.apps/product-service created
service/product-service created
deployment.apps/store-front created
service/store-front created
deployment.apps/store-admin created
service/store-admin created
deployment.apps/virtual-customer created
deployment.apps/virtual-worker created
```

## (3) Azure OpenAI サービスのリソース作成とモデルのデプロイ
Azure OpenAI サービスを作成します。[下記のドキュメント](https://learn.microsoft.com/ja-jp/azure/ai-services/openai/how-to/create-resource?pivots=web-portal)を参考にしてサービスを作成とモデルのデプロイを実施してください。
今回のアプリでは Azure OpenAI サービスの `gpt-35-turbo` のモデルを利用します。Azure OpenAI サービスのリージョンによって[利用できるモデルが異なる](https://learn.microsoft.com/ja-jp/azure/ai-services/openai/concepts/models)点にご注意ください。なお、 `gpt-35-turbo`は東日本リージョンでも利用できます。

https://learn.microsoft.com/ja-jp/azure/ai-services/openai/how-to/create-resource?pivots=web-portal

なお、この手順でモデルをデプロイしたときに入力した`モデルのでデプロイ名`、Azure OpenAI の`キー`と`エンドポイント`は後で利用します。これらは Azure ポータルの Azure OpenAI サービスの「キーとエンドポイント」メニューから確認できます。

## (4) EC サイトアプリに AI サービスをデプロイする
再びコンソールに戻り、oc コマンドを用いて ai-service をデプロイします。
下記の ai-service のマニフェストを`ai-service.yaml`ファイルに保存してください。このとき、マニフェスト内の AZURE_OPENAI_DEPLOYMENT_NAME、AZURE_OPENAI_ENDPOINT、OPENAI_API_KEY の値 (value) には、それぞれ前の手順の`モデルのでデプロイ名`、Azure OpenAI の`エンドポイント`、および`キー`をそれぞれ入力してください。(なお、通常マニフェストに直接 API キー情報を入力することは望ましくありませんので、運用環境では secret や Azure Key Vault などの利用するように変更してください）


``` yaml
apiVersion: apps/v1
kind: Deployment
metadata:
  name: ai-service
spec:
  replicas: 1
  selector:
    matchLabels:
      app: ai-service
  template:
    metadata:
      labels:
        app: ai-service
    spec:
      nodeSelector:
        "kubernetes.io/os": linux
      containers:
      - name: ai-service
        image: ghcr.io/azure-samples/aks-store-demo/ai-service:latest
        ports:
        - containerPort: 5001
        env:
        - name: USE_AZURE_OPENAI 
          value: "True"
        - name: AZURE_OPENAI_DEPLOYMENT_NAME 
          value: ""
        - name: AZURE_OPENAI_ENDPOINT 
          value: ""
        - name: OPENAI_API_KEY 
          value: ""
        resources:
          requests:
            cpu: 20m
            memory: 50Mi
          limits:
            cpu: 30m
            memory: 65Mi
---
apiVersion: v1
kind: Service
metadata:
  name: ai-service
spec:
  type: ClusterIP
  ports:
  - name: http
    port: 5001
    targetPort: 5001
  selector:
    app: ai-service
```

上記ファイルを保存したら、下記のコマンドを実行して ai-service のデプロイを実施します。

``` console
oc apply -f ai-service.yaml
```

下記のように結果が表示されます。
```
deployment.apps/ai-service created
service/ai-service created
```

## (5) EC サイトの公開
コンソールから下記のコマンドを実行して Route を作成し、EC サイトのユーザ向けポータルと管理ポータルのサービスを公開します。
``` console
oc create route edge store-front --service store-front
oc create route edge store-admin --service store-admin
```
`oc get route`を実行して Route を一覧表示します。次のようにそれぞれのサービスの URL が表示されます。
```
bash-4.4 ~ $ oc get route
NAME          HOST/PORT                                                     PATH   SERVICES      PORT    TERMINATION   WILDCARD
store-admin   store-admin-oaidemo.apps.<domain>.<region>.aroapp.io          store-admin   <all>   edge          None
store-front   store-front-oaidemo.apps.<domain>.<region>.aroapp.io          store-front   <all>   edge          None
```

## (6) EC サイトの管理ポータルに接続して商品を追加
(5) の手順で作成した管理ポータルの URL にブラウザーから接続します。サイトが表示されたら右上の「Products」の文字をクリックすると、製品の一覧画面に移動します。

![スクリーンショット 2023-12-17 202149.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/255074/b8a1a3ac-dbae-2db4-80e3-86659aa4af37.png)

画面右上の「Add Product」をクリックします。
商品追加画面が出てきますので、Name 欄に商品名、Keywords に特徴を追加します。
そして最後に 「Ask AI Assitant」ボタンをクリックすると、Azure OpenAI を活用して商品説明が追加されます。
下図に例を示します。この EC サイトはペット用品店のサンプルなので、ペット用品を追加しています。日本語でも問題なく動作します。

![スクリーンショット 2023-12-17 202759.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/255074/51ca4ed6-2a48-f696-4e03-e6bd962e61b6.png)

特徴をとらえた良い感じの説明文を追加してくれました。
「Save Product」ボタンを押すと商品一覧に追加されます。ユーザ向けポータルにも商品が追加されているのが確認できます。

![スクリーンショット 2023-12-17 203308.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/255074/84b7baeb-d53b-9d21-1458-be8f6b2900df.png)

# さいごに
本記事では、EC サイトで Azure OpenAI を活用するサンプルアプリを ARO にデプロイする手順をご紹介しました。今回は商品の新規追加時の説明文を Azure OpenAI 自動作成するユースケースですが、たとえば EC サイトであれば他にもコメント欄の膨大なコメントを要約させるなど、他にも色々な活用方法があると思います。
また、OpenAI の活用においては企業内部情報や顧客情報など様々な機密データを取り扱う場合もあります。ARO と Azure OpenAI は仮想ネットワーク内部でプライベート接続してデータのやり取りが可能ですので、様々なデータを利用して活用できます。
すでに稼働している企業アプリやシステムに Azure OpenAI を活用することで、これまでに無い効率化や付加価値の向上が実現できると思いますので、ぜひ OpenShift で稼働中のアプリと OpenAI を連携をご検討ください。本記事がその一助となれば大変うれしいです。