概要

PowerApps のカメラで撮影した画像を API Management 経由で FaceAPI に転送し、その画像の分析結果「感情、性別、年齢」を PoweApps に表示するアプリの実装手順を数回に分け記載しています。また、並行して、その分析結果を CosmosDB に保存しておき、PowerApps からの累積情報取得リクエストにより累積クエリ結果「感情分布、性別分布」を PowerApps に返し、円グラフ表示する機能の実装手順も複数回に分け記載します。なお、PowerApp の画面作成については省略し、APIコール部分とその戻り値の部分に焦点をあてて記載しています。
本アプリの全体構成は下図となります。

今回（第10回目）の構成箇所は下図の部分となります。

第10回目は、第３回で作成した API Management（以下、APIM）に第9回で作成した Functions を登録し、前回と同様の結果が得られることを確認してみます。

実行環境

macOS Big Sur 11.3
Python 3.8.3

Azure Portal上での API Management と Functions の紐付け

第３回で作成した API Management の「apim-ituru-faceapi」に前回作成した Functions の「iturufuncfacecosmos」を紐付けます。手順については「第３回」を参照ください

紐付け結果は以下とまります。

API の実装

次に、以下の順で「iturufuncfacecosmos」の API を実装していきます。
「Design」タグで「GET HTTPTriggerGet」を選択し、「Frontend」ー「Oepn from-based editor」をクリックします。

画面中央タブ「Responses」を選択し、「Add Response」から「200 OK」を選択します。

「200 OK」の「+ Add representation」を押し「CONTENT TYPE」で「application/json」を選択します。
次に「SAMPLE」に以下を入力します。

{
    "emo_graph": [
        {
            "感": "幸",
            "値": 2
        },
        {
            "感": "無",
            "値": 1
        }
    ],
    "gen_graph": [
        {
            "性": "male",
            "値": 1
        },
        {
            "性": "female",
            "値": 2
        }
    ]
}

次に「DEFINITION」を押し、「+ New definition」を選択します。

「Definition name」に「FaceCosmosGetResponse」と入力し、画面下部の「Create Definition」ボタンを押します。

元の画面に戻り、画面下部の「Save」ボタンを押します。
再度、「Design」タグの「Frontend」から「OpenAPI editor(JSON)」を選択します。

上記で定義（definition）された内容が反映されていることを確認します（もしくは、編集します）。

これで、APIの実装は完了です。

APIM でのデータ取得確認

画面上部から「Test」タブを選択し、表示される画面の下部にある「Send」を押します。

実行結果が表示され、APIM -> Functions 経由で CosmosDB から感情毎の件数と性別毎の件数を Array型のJSON形式で取得できることを確認できました。

次回について

次回（第11回）は、PowerApps から本APIM -> Functions 経由で CosmosDB から感情毎の件数と性別毎の件数を Array型のJSON形式で取得できることを確認します。

参考情報

以下の情報を参考にさせていただきました。感謝申し上げます。
Microsoft (Office365) PowerAppsからFlowに、マップデータを渡して、配列データを受け取る方法
 PowerApps / PowerAutomate カスタムコネクタを OpenAPI（Swagger）Specから作成する