Azureコンピュータビジョンによるサーバレスサムネイル生成


導入


このガイドでは、Azureコグニティブサービスと呼ばれる既存のAIサービスを紹介したいと思います.
サムネイルは単にオリジナルのイメージの小さいバージョンであるということは確かに知られているように、ウェブアプリケーションのサムネイルは、サムネイルが小さいという事実のために、彼らはオリジナルの画像よりも少ない帯域幅を必要とし、ウェブサイトの読み込みを高速化するため、製品の画像などを表示するためのような多くの場所で使用されています.
Azureコンピュータビジョンは、Azure認知サービスの一部です.しかし、Azure認知サービスは何ですか?一目で、Azure認知サービスは以下の特徴を提供します:
  • 言葉
    テキスト
  • へのスピーチ
    のテキストへの
  • テキスト
  • の音声翻訳
  • 話者認識
  • 言語
  • 実体認識
  • 感情分析
  • 質問回答
  • 会話言語理解
  • トランスレータ
  • ビジョン
  • コンピュータビジョン
  • カスタムビジョン
  • フェイスAPI
  • 決定
  • 異常検出
  • 内容減速剤
  • のpersonalizer
  • オープンソース
  • openaiサービス
  • 一言で言えば、Azureの認知サービスは様々な中古のAIサービスを提供します.Azureコンピュータビジョンはサムネイル世代よりはるかに多くの機能性を提供します、しかし、我々は現在これを残します😀).
    Azure認知サービスの詳細については、チェックアウト
    official documentation

    なぜサムネイル生成のためにAzureコンピュータビジョンを使用すべきか?


    サムネイルを作成することは非常に挑戦することができますし、このトピックをカバーする無数のプログラミング言語のための様々なチュートリアルがあります.サムネイルを作成するとき、Azureコンピュータービジョンは次のことを行います.
  • は、イメージから要素を散らして、主なオブジェクト(s)が現れる像の領域を利子の領域を識別する.
  • は、関心の識別された領域に基づいてイメージを耕作します.
  • ターゲットのサムネイル寸法に合わせてアスペクト比を変更します.
  • 特にスマートトリミングは、すなわち、検出や除去要素の除去、非常に便利な機能です.あなた自身のサムネイル作成アルゴリズムを実装する想像し、センターは常にトリミングされますが、関心のある領域は、センターの外です.したがって、アルゴリズムは実際に関連している何かを収穫するでしょう、そして、それはスマートトリミングが救助に来るところです!

    必要条件

  • アクティブなサブスクリプションを持つアジュールアカウント.場合は、Azureアカウントを持っていない場合は、先に行き、無料hereのいずれかを作成します.
  • Azure CLIは、Azure CLI locallyをインストールするか、Azure Cloud Shellを使うことができます.

    始めましょう


    コンピュータビジョン展開


    リソースグループを作成します
     az group create -l <location> --name <name>
    
    コンピュータビジョンリソースを作成します
    az cognitiveservices account create \
        --name <computer-vision-resource-name> \
        --resource-group <resource-group> \
        --kind ComputerVision \
        --sku F0 \
        --location <location> \
        --yes
    

    ℹ️ For the pricing tier, instead of F0 (= free tier) you can also specify S1 (= Standard S1).

    ⚠️ Only one free tier can be deployed at a time.


    Azureポータル経由でコンピュータビジョンサービスのエンドポイントURLを取得します

    アクセスキーを取得します.
    az cognitiveservices account keys list \
    --name <computer-vision-resource-name> \
    --resource-group <resource-group>
    

    ℹ️ In case you want to regenerate or rotate your keys, you can use the following command:


    az cognitiveservices account keys regenerate \
    --key-name <Key1, Key2> \
    --name <computer-vision-resource-name>
    --resource-group <resource-group>
    

    AzureコンピュータビジョンAPIによるサムネイルの生成


    サムネイルAPIの要件と制限


    エンドポイントを呼び出す前に、いくつかのイメージ要件と制限があります.
  • イメージファイルサイズは、4 MB
  • イメージ寸法は、50 x
  • サポートされるイメージ形式
  • JPEG
  • PNG
  • GIF
  • BMP
  • APIの呼び出し方



    リクエストパラメータ:
    名称
    種類
    説明


    サムネイルの幅.1から1024の間でなければならない.最低50点推奨.
    高さ

    サムネイルの高さ.1から1024の間でなければならない.最低50点推奨.
    スマートクロップ(任意)
    ブーリアン
    スマートトリミングを有効にするためのブールフラグ.
    モデルバージョン(任意)
    文字列
    オプションモデルで、AIモデルのバージョンを指定します.デフォルト値は“最新”です.

    リクエストヘッダ:
    名称
    種類
    説明
    コンテンツタイプ
    文字列
    APIに送られるボディーのメディアタイプ.
    OCP APIMサブスクリプションキー
    文字列
    このAPIへのアクセスを提供するサブスクリプションキー

    リクエスト本文:
    サムネイルAPIは次のコンテンツタイプをサポートします.
  • アプリケーション/JSON
  • アプリケーション/オクテットストリーム
  • multipart/formデータ
  • アプリケーション/JSON :
    {"url":"http://example.com/images/test.jpg"}
    
    アプリケーション/オクテットストリーム:
    [Binary image data]
    
    マルチパート/フォームデータ
    [Binary image data]
    

    ℹ️ The above section is an excerpt from the official documentation. For more details, please checkout the official documentation.


    リクエスト例


    アプリケーション/JSON :
    curl --location --request POST 'https://<computer-vision-resource-name>.cognitiveservices.azure.com/vision/v3.2/generateThumbnail?width=200&height=200&smartCropping=true&model-version=latest' \
    --header 'Content-Type: application/json' \
    --header 'Ocp-Apim-Subscription-Key: <api-key>' \
    --data-raw '{
        "url":"http://example.com/images/test.jpg"
    }'
    
    アプリケーション/オクテットストリーム:
    curl --location --request POST 'https://<computer-vision-resource-name>.cognitiveservices.azure.com/vision/v3.2/generateThumbnail?width=200&height=200&smartCropping=true&model-version=latest' \
    --header 'Content-Type: application/octet-stream' \
    --header 'Ocp-Apim-Subscription-Key: <api-key>' \
    --data-binary '@<path-to-image>'
    
    マルチパート/フォームデータ
    curl --location --request POST 'https://<computer-vision-resource-name>.cognitiveservices.azure.com/vision/v3.2/generateThumbnail?width=200&height=200&smartCropping=true&model-version=latest' \
    --header 'Content-Type: multipart/form-data' \
    --header 'Ocp-Apim-Subscription-Key: <api-key>' \
    --form 'img=@"<path-to-image>"'
    
    私の例のリクエストでは、次のイメージを使用しました.

    ℹ️ The image is taken from Unsplash. Unsplash is really awesome and offers freely-usable images. You should definitely check it out!


    これは、スマートトリミングのイメージです:

    そして、これはスマートトリミングのないイメージです:

    あなたが明らかにキーボードのスマートなトリミング部分のない画像で見ることができるように、右腕が離れて切り取られた.また、左側のコーナーでは、植物がまだ表示されます.キーボードでは、両方の腕だけでなく、トリミングスマートで画像では、左のコーナーの植物が完全に削除されている表示されます.

    価格


    あなたがうまくいけば、Azureコンピュータビジョンのサムネイルの生成を見ることができるように非常に使いやすく、スマートトリミングのような便利な機能を提供しています.しかし、APIはいくらですか?
    Azureコンピュータビジョンは完全に管理されたServerlessサービスです、そして、価格は「あなたとしての賃金」です.サムネイル生成のためのコンピュータビジョンサービスは非常に手頃な価格です.

    ⚠️ Disclaimer: This is an example configuration. Other prices may apply depending on configuration and region. For more precise estimation, I highly recommend using the Azure Pricing Calculator.

    ℹ️ For enterprise scenarios with high volumes, Azure also offers a Committed Tier, where fixed contingents can be purchased at a reduced price. For more details, checkout the official pricing page for Azure Computer Vision.


    結論


    私は、あなたがサムネイル世代のためにAzureコンピュータビジョンに少し近寄って来ることができることを望みます.それは非常にサムネイルの作成を大幅に簡素化し、スマートトリミングのような機能を非常に簡単に開発者の人生を作ることができる信じられないほどのサービスです.また、サービスのいずれかの財産コストはありません😉
    読書のおかげで、私はこの機能についてのあなたの考えを教えてください!