【Azure】Cognitive Searchで画像をAI検索

##ダレトク記事？
・Microsoft Azureをこれから試してみたい人
・AIを体験してみたい人
・OCRを体験してみたい人

##Azure Cognitive Searchとは？
Azure Cognitive Searchでは、保存されたデータの全文検索や画像を解析して検索するなど、AI機能を活用した検索が可能です。
今回は画像から連想されるキーワードによる検索機能を作ってみたいと思います。
（例えば「洗濯機」の画像を「家電」というキーワードで検索できるなど）

※Azureのサービスを利用するには無料の[アカウント登録](https://azure.microsoft.com/ja-jp/free/)が必要です。
　まだ登録されていない方はまずはアカウント登録から始めましょう。

##サンプル動画を見てみよう
今回の記事では以下のようなデモアプリを作成します。作成手順も載せているので是非見てみてください。
<iframe width="640" height="360" src="https://www.youtube.com/embed/G7OvVWP8RCQ" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

##Azureに画像ファイルを保存しよう
今回はAzure Blob Storageに画像を保存していきたいと思います。

###ストレージアカウントを作成
Azure Blob Storageを利用するため、まずはストレージアカウントを作成していきます。
直観でポチポチ進めていけると思います。
※不安な方は↑の動画を見ながら進めてください。
![image-1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/521440/188d789a-72dc-64e5-1fde-385e45f95b07.png)

###コンテナを作成
コンテナはBlobを保管している場所です。以下のところから作成します。
![image-5.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/521440/75c3a984-d5d9-c25f-cfa2-393e343597d0.png)

###画像のアップロード
作成したコンテナに検索で使う画像をアップロードしていきます。
![image-6.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/521440/c50d8eb5-b8e5-d6bb-3af3-cf1c30823bc9.png)

##画像検索システムを作ろう
アップロードした画像をAI解析して検索できるようにしていきます。
Azure Cognitive Searchを使っていきます。

###Azure Cognitive Search で登場するキーワード

####データソース
データの保管場所。今回はBLOBを指定します。

####インデクサー
データソースを巡回し、インデックスを作ってくれます。
インデックスは索引のようなもので、データ（今回は画像）の検索に活用されます。

####インデックス
インデクサーによって作成された索引です。
今回の仕組みでは、画像をAI機能によって解析し、画像から連想されるキーワード等が書き込まれます。

###Cognitive Searchを作成
まずはCognitive Searchを作成します。
価格レベルのデフォルトが「Stanard」になっているので、「Free」に変えておきましょう。
![image-8.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/521440/f347e176-66be-b6f1-3754-f5554a82fbfc.png)

###データのインポート
データソースにBLOBを指定する作業です。作成したコンテナを指定します。
![image-9.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/521440/ad086010-962a-21d2-b101-da55b38dfac3.png)

###エンリッチメントの追加
画像をAI機能で解析するために必要な設定です。
![image-10.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/521440/b6a50272-0e82-c19c-844c-48e5fbbd79f9.png)
以下の箇所をチェックしておきましょう。
![image-11.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/521440/95de5148-1b49-1c19-8ef2-1c2f704a2ea8.png)

###インデックスの設定
キーのデフォルトが「metadata_storage_path」です。これは画像が保存されているパスになります。
これをキーにするとBase64エンコードされて面倒なので、お試しであればキーを 「metadata_storage_size」に変更しておきましょう。

あとはファイル名があった方が便利なので 「metadata_storage_name」にチェックを付けておきましょう。
![image-12.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/521440/83880bce-7e2c-8877-1a34-3210d9397b71.png)

###「metadata_storage_path」 をURLデコード
デフォルトの設定だと 「metadata_storage_path」 がURLエンコードされてしまっているのでデコードします。

インデクサー定義の34から41行目を追加します。
![image-13.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/521440/971c3489-add0-b846-1e58-3a28688270ab.png)

![image-14.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/521440/c49e4961-31a3-7e1d-ce20-53de3b0b8267.png)

追加する文字列↓

```
,
 {
   "sourceFieldName": "metadata_storage_path",
   "targetFieldName": "metadata_storage_path",
   "mappingFunction": {
     "name": "urlDecode",
     "parameters": null
   }
 }
```

###日本語に対応する
デフォルトだと画像の解析結果が英語です。スキルセットで日本語に対応できるようにします。
![image-15.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/521440/86f15060-8776-8676-deab-c36dc8402a65.png)
“en”になっているところを”ja”に変えてください。（２か所あります）
![image-16.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/521440/03ed43ae-baf4-793c-8022-37a5fa097148.png)

###インデクサーを実行
スキルセットを修正したのでインデクサーを一度リセットしてから実行します。
![image-17.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/521440/f6aaa571-7fab-be99-631c-877b000eb948.png)
![image-18.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/521440/88d79c69-5484-1119-1136-de21b352cbea.png)

##デモアプリを作成しよう
ここまでの手順で検索するための設定は完了です。
デモアプリを作成して画像検索を試してみましょう。

###デモアプリを作成
インデックスの上部からデモアプリの作成ができます。
![image-19.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/521440/6c1b98a2-b275-6eef-94f5-bb01007d86c1.png)
「縮小版」というところに 「metadata_storage_path」 、
「タイトル」に 「metadata_storage_name」 を指定しましょう。
![image-20.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/521440/61579d15-a4fe-f85b-f28d-b81c914806c7.png)

###デモアプリを実行
ダウンロードしたデモアプリで検索を試してみましょう。
画像から連想されるキーワードでの検索ができると思います。
![image-21-1024x672.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/521440/fd7cb0e1-6564-9cb7-49de-9656d12bd503.png)

##さいごに
いかがでしたでしょうか。Azure Cognitive SearchによってノーコードでAI機能を活用した検索が簡単に実現できました。
みなさんも是非、アプリ開発に Azure Cognitive Search を活用して頂ければと思います。

今回紹介させて頂いた内容は、 Azure Cognitive Search の機能のほんの一部です。
また機会があれば別の機能を紹介させて頂ければと思います。

##元記事
私が運営する以下のblogにも同じ記事を載せています。
https://senote.tokyo/azure-cognitive-search/