LINE WORKS Bot メッセージの送信 JavaScript サンプルコード

# Bot - メッセージの送信

Bot からのメッセージ送信方法は、ユーザー指定とトークルーム指定の２つがあります。
- [メッセージの送信 - ユーザー指定](https://developers.worksmobile.com/jp/reference/bot-user-message-send?lang=ja)
POST/bots/{botId}/users/{userId}/messages

- [メッセージの送信 - トークルーム指定](https://developers.worksmobile.com/jp/reference/bot-channel-message-send?lang=ja)
POST/bots/{botId}/channels/{channelId}/messages

グループや組織のトークルームにメッセージを送信するにはトークルーム指定を使用します。

## JavaScript Sample Code

request モジュールを使用したサンプルコードです。
事前に `npm install request` を行って request モジュールをインストールしてください。
下記はユーザー指定でのメッセージ送信です。

```js: ApiRequest.js
var request = require("request");
var token = "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx==";
var botId = "1234567890";
var userId = "xxxxx-xxxxxxxxx-xxxxxx";
var options = {
  "method": "POST",
  "url": `https://www.worksapis.com/v1.0/bots/${botId}/users/${userId}/messages`,
  "headers": {
    "Content-Type": "application/json",
    "Authorization": `Bearer ${token}`
  },
  "body": JSON.stringify({
    "content": {
      "type": "text",
      "text": "test"
    }
  })
};
request(options, function (error, response) {
  if (error) throw new Error(error);
  console.log(`statusCode: ${response.statusCode}\nstatusMessage: ${response.statusMessage}`);
});
```

## Request Body Sample

サンプルコードの `body` を変更することにより、様々なタイプのメッセージを送信することができます。

### type: text

```js
"content": {
  "type": "text",
  "text": "test"
}
```
![1657265765.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2726616/4c5a9741-6946-df2c-ca2f-93c8bf97e96b.png)

### type: image

```js
"content": {
    "type": "image",
    "previewUrl": "https://developers.worksmobile.com/favicon.png",
    "resourceUrl": "https://developers.worksmobile.com/favicon.png"
}
```
![1657265963.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2726616/5fa31a51-af50-8b80-4fc3-9c35ad10f8a8.png)

### type: link

```js
"content": {
    "type": "link",
    "contentText": "contentText",
    "linkText": "worksmobile homepage",
    "link": "http://www.worksmobile.com"
}
```
![1657267842.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2726616/8e37a137-1bf4-73c2-6d85-c2131460bcf8.png)

### type: sticker

```js
"content": {
    "type": "sticker",
    "packageId": "1",
    "stickerId": "3"
}
```
![1657504707.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2726616/b4d46726-0526-ac10-9895-2d826679b975.png)

### type: button_template

```js
"content": {
    "type": "button_template",
    "contentText": "button template",
    "actions": [
        {
            "type": "message",
            "label": "Message lable",
            "text": "Message text"
        },
        {
            "type": "message",
            "label": "Postback lable",
            "text": "Postback text",
            "postback": "postback data"
        },
        {
            "type": "uri",
            "label": "LINE WORKS",
            "uri": "https://line.worksmobile.com/jp/"
        }
    ]
}
```
![1657504882.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2726616/fa604b4e-2fa2-364d-74ff-324ba4769615.png)

### type: list_template

```js
"content": {
    "type": "list_template",
    "coverData": {
        "backgroundImage": "https://line.worksmobile.com/jp/wp-content/uploads/guidelines-img-17.png",
        "title": "title",
        "subtitle": "subtitle"
    },
    "elements": [{
        "title": "WorksMobile's Homepage",
        "subtitle": "Link action subtitle",
        "image": "https://line.worksmobile.com/jp/wp-content/uploads/guidelines-img-17.png",
        "action": {
            "type": "uri",
            "label": "Visit",
            "uri": "https://line.worksmobile.com"
        }
    }, {
        "title": "List Temaplate postback",
        "subtitle": "postback subtitle",
        "image": "https://line.worksmobile.com/jp/wp-content/uploads/guidelines-img-17.png",
        "action": {
            "type": "message",
            "label": "Postback lable",
            "text": "Postback text",
            "postback": "postback data"
        }
    }],
    "actions": [[{
        "type": "message",
        "label": "下部ボタン Actions",
        "text": "下部ボタン Actions",
        "postback": "bottom button actions postback"
    }]]
}
```
![1657524595.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2726616/cd5624ea-a787-939b-81cf-a3291f156280.png)

### type: carousel

```js
"content": {
    "type": "carousel",
    "imageAspectRatio": "square",
    "columns": [{
        "thumbnailImageUrl": "https://line.worksmobile.com/jp/wp-content/uploads/guidelines-img-17.png",
        "title": "carousel title 1",
        "text": "roomId carousel text",
        "defaultAction": {
            "type":"uri",
            "label":"Visit",
            "uri":"https://www.naver.com"
        },
        "actions": [{
            "type": "postback",
            "label": "carousel Postback",
            "data": "carousel postback data",
            "displayText": "Postback"
        },{
            "type": "message",
            "label": "carousel message",
            "text": "carousel message"
        },{
            "type": "uri",
            "label": "LINE WORKS",
            "uri": "https://line.worksmobile.com/jp/"
        }]
    },{
        "thumbnailImageUrl": "https://line.worksmobile.com/jp/wp-content/uploads/guidelines-img-17.png",
        "title": "carousel title 2",
        "text": "carousel text 2",
        "defaultAction": {
            "type":"uri",
            "label":"Visit",
            "uri":"https://www.naver.com"
        },
        "actions": [{
            "type": "message",
            "label": "carousel Actions",
            "text": "carousel Actions",
            "postback": "carousel actions postback"
        }]
    }]
}
```
![1657525135.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2726616/4af06a26-a13c-f9d5-de8f-84362a54e0c1.png)

### type: image_carousel

```js
"content": {
    "type": "image_carousel",
    "columns": [{
        "imageUrl": "https://line.worksmobile.com/jp/wp-content/uploads/guidelines-img-17.png",
        "action": {
            "type": "message",
            "label": "imgCarousel1",
            "text": "image carousel message"
        }
    },{
        "imageUrl": "https://line.worksmobile.com/jp/wp-content/uploads/guidelines-img-17.png",
        "action": {
            "type": "message",
            "label": "imgCarousel2",
            "text": "image carousel message"
        }
    }]
}
```
![1657525453.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2726616/bb10643d-1000-7efc-963c-9a61006c8288.png)

### type: file

```js
"content": {
    "type": "file",
    "resourceUrl": "https://line.worksmobile.com/kr/wp-content/uploads/2020/05/user-start-guide-v2.0.pdf"
}
```
![1657525994.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2726616/82561ff4-26e2-8a89-da66-24e8e4786d12.png)

### type: flex

```js
{
  "type": "carousel",
  "contents": [
    {
      "type": "bubble",
      "size": "mega",
      "header": {
        "type": "box",
        "layout": "horizontal",
        "contents": [
          {
            "type": "text",
            "text": "WORKS MOBILE",
            "size": "lg",
            "color": "#00c73c",
            "weight": "bold"
          }
        ],
        "backgroundColor": "#ffffff"
      },
      "body": {
        "type": "box",
        "layout": "vertical",
        "contents": [
          {
            "type": "box",
            "layout": "vertical",
            "contents": [
              {
                "type": "image",
                "url": "https://i.ibb.co/tXyrDKh/11-matthew-operation-quality-manager.png",
                "size": "full"
              }
            ],
            "width": "120px",
            "height": "120px",
            "cornerRadius": "180px",
            "borderWidth": "1px",
            "borderColor": "#22222210",
            "offsetStart": "75px",
            "offsetEnd": "75px"
          },
          {
            "type": "box",
            "layout": "vertical",
            "contents": [
              {
                "type": "text",
                "text": "John Smith",
                "weight": "bold",
                "size": "xl",
                "align": "center"
              },
              {
                "type": "text",
                "text": "Graphic Designer",
                "size": "sm",
                "align": "center"
              }
            ],
            "margin": "xl"
          },
          {
            "type": "box",
            "layout": "vertical",
            "contents": [
              {
                "type": "box",
                "layout": "baseline",
                "contents": [
                  {
                    "type": "text",
                    "text": "Department",
                    "size": "sm",
                    "color": "#858f89",
                    "flex": 3,
                    "margin": "md"
                  },
                  {
                    "type": "text",
                    "text": "Product Design 1",
                    "size": "sm",
                    "margin": "md",
                    "flex": 5
                  }
                ]
              },
              {
                "type": "box",
                "layout": "baseline",
                "contents": [
                  {
                    "type": "text",
                    "text": "Phone",
                    "size": "sm",
                    "color": "#858f89",
                    "flex": 3,
                    "margin": "md"
                  },
                  {
                    "type": "text",
                    "text": "000-111-2222",
                    "size": "sm",
                    "margin": "md",
                    "flex": 5
                  }
                ],
                "margin": "sm"
              },
              {
                "type": "box",
                "layout": "baseline",
                "contents": [
                  {
                    "type": "text",
                    "text": "E-mail",
                    "size": "sm",
                    "color": "#858f89",
                    "flex": 3,
                    "margin": "md"
                  },
                  {
                    "type": "text",
                    "text": "email@works.com",
                    "size": "sm",
                    "margin": "md",
                    "flex": 5
                  }
                ],
                "margin": "sm"
              }
            ],
            "margin": "xxl",
            "width": "260px",
            "alignItems": "center",
            "paddingAll": "6px"
          }
        ]
      },
      "footer": {
        "type": "box",
        "layout": "vertical",
        "contents": [
          {
            "type": "button",
            "action": {
              "type": "uri",
              "label": "Send a message",
              "uri": "https://worksmobile.com"
            },
            "style": "primary"
          },
          {
            "type": "button",
            "action": {
              "type": "uri",
              "label": "Call",
              "uri": "https://worksmobile.com"
            },
            "margin": "md",
            "style": "secondary"
          }
        ]
      }
    },
    {
      "type": "bubble",
      "size": "mega",
      "header": {
        "type": "box",
        "layout": "horizontal",
        "contents": [
          {
            "type": "text",
            "text": "WORKS MOBILE",
            "size": "lg",
            "color": "#00c73c",
            "weight": "bold"
          }
        ],
        "backgroundColor": "#ffffff"
      },
      "body": {
        "type": "box",
        "layout": "vertical",
        "contents": [
          {
            "type": "box",
            "layout": "vertical",
            "contents": [
              {
                "type": "image",
                "url": "https://i.ibb.co/jrD8083/05-emma-business-maketing-manager.png",
                "size": "full"
              }
            ],
            "width": "120px",
            "height": "120px",
            "cornerRadius": "180px",
            "borderColor": "#22222210",
            "borderWidth": "1px",
            "offsetStart": "75px",
            "offsetEnd": "75px"
          },
          {
            "type": "box",
            "layout": "vertical",
            "contents": [
              {
                "type": "text",
                "text": "Sarah Harding",
                "weight": "bold",
                "size": "xl",
                "align": "center"
              },
              {
                "type": "text",
                "text": "UX Designer",
                "size": "sm",
                "align": "center"
              }
            ],
            "margin": "xl"
          },
          {
            "type": "box",
            "layout": "vertical",
            "contents": [
              {
                "type": "box",
                "layout": "baseline",
                "contents": [
                  {
                    "type": "text",
                    "text": "Department",
                    "size": "sm",
                    "color": "#858f89",
                    "flex": 3,
                    "margin": "md"
                  },
                  {
                    "type": "text",
                    "text": "Interface Design 1",
                    "size": "sm",
                    "margin": "md",
                    "flex": 5
                  }
                ]
              },
              {
                "type": "box",
                "layout": "baseline",
                "contents": [
                  {
                    "type": "text",
                    "text": "Phone",
                    "size": "sm",
                    "color": "#858f89",
                    "flex": 3,
                    "margin": "md"
                  },
                  {
                    "type": "text",
                    "text": "333-444-5555",
                    "size": "sm",
                    "margin": "md",
                    "flex": 5
                  }
                ],
                "margin": "sm"
              },
              {
                "type": "box",
                "layout": "baseline",
                "contents": [
                  {
                    "type": "text",
                    "text": "E-mail",
                    "size": "sm",
                    "color": "#858f89",
                    "flex": 3,
                    "margin": "md"
                  },
                  {
                    "type": "text",
                    "text": "email@works.com",
                    "size": "sm",
                    "margin": "md",
                    "flex": 5
                  }
                ],
                "margin": "sm"
              }
            ],
            "margin": "xxl",
            "width": "260px",
            "alignItems": "center",
            "paddingAll": "6px"
          }
        ]
      },
      "footer": {
        "type": "box",
        "layout": "vertical",
        "contents": [
          {
            "type": "button",
            "action": {
              "type": "uri",
              "label": "Send a message",
              "uri": "https://worksmobile.com"
            },
            "style": "primary"
          },
          {
            "type": "button",
            "action": {
              "type": "uri",
              "label": "Call",
              "uri": "https://worksmobile.com"
            },
            "margin": "md",
            "style": "secondary"
          }
        ]
      }
    }
  ]
}
```
![1657526200.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2726616/ce8733c5-7ff7-1d10-50d8-ff675052ebcd.png)

[Flexible Template Simulator](https://flex-simulator.worksmobile.com/) を使用すると、実際にメッセージを送信しなくてもレイアウトを確認し、メッセージ送信APIで利用することができます。

### quickReply

クイックリプライ (quick reply) は今まで紹介したすべてのメッセージタイプで使用可能です。
使用するには、`content` パラメータ内に `quickReply` パラメータを設定します。

```js: quickReply with type: text
"content": {
    "type": "text",
    "text": "quickReply",
    "quickReply": {
        "items": [{
            "action": {
                "type": "postback",
                "label": "Postback",
                "data": "postback data",
                "displayText": "Postback"
            }
        },{
            "action": {
                "type": "message",
                "label": "メッセージ",
                "text": "メッセージ"
            }
        },{
            "imageUrl": "https://developers.worksmobile.com/favicon.png",
            "action": {
                "type": "uri",
                "label": "LINE WORKS",
                "uri": "https://line.worksmobile.com/jp/"
            }
        },{
            "action": {
                "type": "camera",
                "label": "カメラ"
            }
        },{
            "action": {
                "type": "cameraRoll",
                "label": "カメラロール"
            }
        },{
            "action": {
                "type": "location",
                "label": "場所"
            }
        }]
    }
}
```
![1657608061.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2726616/c9c86d1f-931f-9b7e-1e33-d6a9be3dc208.png)


以上です。