LINEから送った画像をコネクタで使う方法（Azure Logic Apps / Power Automate）

※本記事は「[LINE DC Advent Calendar 2021 (クリスマスプレゼント付き) Advent Calendar 2021](https://qiita.com/advent-calendar/2021/linedc) 24日目」の記事です。

こんにちわ、 [のりじ](https://twitter.com/nori790822) です。
前回、「[LINEで使える「名刺リーダーbot」を完全ノーコードで自作してみた話（Power Automate × LINE Messaging API）](https://qiita.com/nori790822/items/7f7fa648f2ca3c289f52)」という記事を書きました。
Microsoftが提供しているノーコード / ローコードサービスの[Power Automate](https://powerautomate.microsoft.com/ja-jp/) / [Azure Logic Apps](https://azure.microsoft.com/ja-jp/services/logic-apps/) は、LINE Messaging APIをノーコードで利用できます。
LINEのトークルームから画像（トークルームのカメラ撮影の画像も）を送信して処理する方法はやり方を覚えていると便利だなと思ったので自分の忘備録も兼ねてやり方を紹介します。

# 1. トリガーの設定（Power Automate / Azure Logic Apps共通）

Power Automate / Azure Logic Appsどちらも、LINE Messaging APIを利用する場合のトリガーは「要求」を利用します。
ただし、Power Automateの場合「要求（HTTP）コネクタ」はプレミアムコネクタ扱いとなるので利用時はご自身のライセンスを確認してください。

![line001.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/103396/b287ba08-1891-f6e8-d5e6-1e98145922e7.jpeg)

検索窓に「要求」と入力すると表示されます。（図はLogic Appsの画像）

![line002.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/103396/9c8117e3-c401-a3e9-f88f-7af1a1c812d0.jpeg)

トリガーに表示される「HTTP要求の受信時」を選びます。

![line003.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/103396/4ab13253-e016-8bd8-1e38-515e190f34d1.jpeg)

赤枠内の「要求本文のJSONスキーマ」に、以下のJSONをコピペします。

```

{
    "properties": {
        "events": {
            "items": {
                "message": {
                    "properties": {
                        "address": {
                            "type": "string"
                        },
                        "fileName": {
                            "type": "string"
                        },
                        "fileSize": {
                            "type": "number"
                        },
                        "id": {
                            "type": "string"
                        },
                        "latitude": {
                            "type": "number"
                        },
                        "longitude": {
                            "type": "number"
                        },
                        "packageId": {
                            "type": "string"
                        },
                        "stickerId": {
                            "type": "string"
                        },
                        "text": {
                            "type": "string"
                        },
                        "title": {
                            "type": "string"
                        },
                        "type": {
                            "type": "string"
                        }
                    },
                    "type": "object"
                },
                "postback": {
                    "properties": {
                        "data": {
                            "type": "string"
                        }
                    },
                    "type": "object"
                },
                "properties": {
                    "replyToken": {
                        "type": "string"
                    },
                    "source": {
                        "properties": {
                            "groupId": {
                                "type": "string"
                            },
                            "type": {
                                "type": "string"
                            },
                            "userId": {
                                "type": "string"
                            }
                        },
                        "type": "object"
                    },
                    "timestamp": {
                        "type": "number"
                    },
                    "type": {
                        "type": "string"
                    }
                },
                "type": "object"
            },
            "type": "array"
        }
    },
    "type": "object"
}

```

# 2. アクションの設定

LINEのトークルームから送信された画像を取得するための処理部分です。
トリガーと違い、アクション部分はPower AutomateとLogic Appsそれぞれで選択するコネクタ名が変わります。

# 2-1. Logic Appsの場合に選択するコネクタ類

まずはLogic Appsから説明します。

## 2-1-1. For eachコネクタ

![line005.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/103396/c7c52767-e1cd-51d7-7a4d-9ed3c991e780.jpeg)

検索窓に「制御」と入力しクリックすると図のような一覧が表示されるので、一覧の中から「For each」をクリック。

![line004.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/103396/77437da4-b172-67e7-ddcd-b4df8db2342f.jpeg)

「以前の手順から出力を選択」には、「HTTP要求の受信時」の動的なコンテンツ「event」を選択します。

## 2-1-2. HTTPコネクタ

![line006.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/103396/f2809f93-55fc-d62e-dca6-1d2a237c3c7f.jpeg)

検索窓に「HTTP」と入力してクリックすると図のような一覧が表示されるので、一覧の中から「HTTP」をクリック。

![line007.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/103396/16868f40-72eb-ce4e-722b-daea16cf041a.jpeg)

HTTPコネクタは以下の内容を入力していきます。

1. 方法：「GET」を選択
2. URI：以下の内容をコピペします
```
https://api-data.line.me/v2/bot/message/@{items('For_each')?['message']?['id']}/content
```
3. ヘッダー：「キーの入力」部分に「Authorization」、「値の入力」部分は「Bearer 」に続けて[LINE Developers](https://developers.line.biz/ja/)の該当チャネル->「Messaging API設定」ページの「チャネルアクセストークン」をコピペします。
（図の赤枠内の内容）

![line008.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/103396/959aabe5-d852-177c-6ebd-8ed46225353d.jpeg)

## 2-1-3. 以降のコネクタの設定

![line009.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/103396/c3eac953-c56d-8612-25b8-96149d147f5a.jpeg)

後続のコネクタでは、「HTTP」の動的なコンテンツ「本文」を選択することでLINEから送信した画像を利用できます。

![line010.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/103396/00005cda-5dcb-fdd0-97da-7cdd73fde105.jpeg)

図のように、HTTPコネクタ以降はFor eachの中に入れるのもポイントです。

# 2-2. Power Automateの場合に選択するコネクタ類

次はPower Automateの場合について説明します。

## 2-2-1. Apply to eachコネクタ

![line011.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/103396/3ef2ed1d-c771-e842-addd-d2e58d812cc4.jpeg)

検索窓に「コントロール」と入力しクリックすると図のような一覧が表示されるので、一覧の中から「Apply to each」をクリック。

![line012.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/103396/f43f623a-e89d-daa6-8897-04799372d2ab.jpeg)

「以前の手順から出力を選択」には、「HTTP要求の受信時」の動的なコンテンツ「event」を選択します。

## 2-2-2. HTTPコネクタ

![line013.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/103396/3dba540c-010d-2f5f-9965-a52447955845.jpeg)

検索窓に「HTTP」と入力してクリックすると図のような一覧が表示されるので、一覧の中から「HTTP」をクリック。

![line014.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/103396/3f6b6613-4117-02ec-23f2-b6afbcaf38b5.jpeg)

HTTPコネクタは以下の内容を入力していきます。

1. 方法：「GET」を選択
2. URI：以下の内容をコピペします
```
https://api-data.line.me/v2/bot/message/@{items('Apply_to_each')?['message']?['id']}/content
```
3. ヘッダー：「キーの入力」部分に「Authorization」、「値の入力」部分は「Bearer 」に続けて[LINE Developers](https://developers.line.biz/ja/)の該当チャネル->「Messaging API設定」ページの「チャネルアクセストークン」をコピペします。
（Logic Appsのときと同じ）

## 2-2-3. 以降のコネクタの設定

Logic Appsと同様に、後続のコネクタでは「HTTP」の動的なコンテンツ「本文」を選択することでLINEから送信した画像を利用できます。

![line015.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/103396/50b64da5-0f25-7ad8-658a-f107a77a2db1.jpeg)

図のように、HTTPコネクタ以降はApply to eachの中に入れるのもポイントです。

# 3. LINE側の設定

最後にLINE Developersの設定についてです。

![line016.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/103396/403ea45c-d0f8-73ff-1058-3437e06efab8.jpeg)

作成したチャネルのMessaging APIの項目のうち、「Webhook設定」と「Webhookの利用」の部分が図のようにしておいてください。
トリガーの「HTTP要求の受信時」HTTP POSTのURIは、ワークフローを一度保存すると自動で表示されます。
表示後、LINE Developerにコピペしてください。

# 4. 最後に

Logic Apps / Power AutomateでLINE Messaging APIを利用する場合、トリガー部分のJSONとアクション部分の取得のやり方がわかっていれば、本当に簡単に利用することができます。
ノーコードでLINE BOTを作成する方法の1つとしてぜひ！