初めてのLINE BOT〜Node.js〜

#0.前提
+ レベル：超初心者

#1.準備
###1-1.LINE Developerアカウントを作成、ログイン

###1-2.LINE Bot Designerをインストール

###1-3.[こちらのQiita]（https://qiita.com/n0bisuke/items/ceaa09ef8898bee8369d#line-bot）　にそって
BOT情報の入力と設定確認をする。

###要注意の設定
1.
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1565008/68e9feb5-2bd8-0542-72f4-767eb6f52005.png)
[LINE Official Account Manager]をクリック

2.
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1565008/a4802dfe-38a4-2abc-dd68-b2a406d6ef99.png)
応答設定ページの詳細設定で、`　応答メッセージ：オフ` `Webhook:オン`　へ　変更する

+ 応答メッセージとは
  BOTに話しかけたときに、「ご相談ありがとうございます。」などのように、一律でメッセージを返す機能
   (ここでオフにした理由：　今回は問い合わせ内容をそのままオウム返しするようなプログラムを書きたいから)

###1-4. BOTと友達になる
Messaging API設定のQRコードを携帯で読み込んで、友だち追加する。
すると、早速（何も設定していないのに）　、携帯にメッセージが飛んできた

```
〜〜〜〜〜〜さん、はじめまして（くま）！
友だち追加ありがとうございます。（チャンネル名）です。
（以下略）
```
以上で、[こちらのQiita]（https://qiita.com/n0bisuke/items/ceaa09ef8898bee8369d#line-bot）　STEP1まで終わった。

#2.プッシュメッセージ(ブロードキャストメッセージ)を送ろう
###2-1.
1. プロジェクトフォルダ　`linebot`を作成

```terminal
$ mkdir mylinebot
$ cd mylinebot
```

2.SDKインストール

```terminal
tomoko@MB mylinebot % npm init -y
Wrote to /Users/tomoko/Desktop/mylinebot/package.json:

{
  "name": "mylinebot",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [],
  "author": "",
  "license": "ISC"
}

tomoko@MB mylinebot % npm i @line/bot-sdk
⸨░░░░░░░░░░░░░░░░░░⸩ ⠇ fetchMetadata: sill resolveWithNewModule @line/bot-sdk@7.3.0 checking inpm notice created a lockfile as package-lock.json. You should commit this file.
npm WARN mylinebot@1.0.0 No description
npm WARN mylinebot@1.0.0 No repository field.

+ @line/bot-sdk@7.3.0
added 42 packages from 86 contributors and audited 42 packages in 68.904s

6 packages are looking for funding
  run `npm fund` for details

found 0 vulnerabilities
```

3.フォルダ内に　新しいファイル `app.js` を作成

この時点でファイル構成は↓
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1565008/082169f2-ee12-a367-ebf1-6f985ef09549.png)

```app.js
'use strict';

const line = require('@line/bot-sdk');

const config = {
    channelSecret: 'チャンネルシークレット',
    channelAccessToken: 'チャンネルアクセストークン'
};
const client = new line.Client(config);


const main = async () => {

    const messages = [{
        type: 'text',
        text: 'いっせい送信です！'
    }];

    try {
        const res = await client.broadcast(messages);
        console.log(res);        
    } catch (error) {
        console.log(`エラー: ${error.statusMessage}`);
        console.log(error.originalError.response.data);
    }
}

main();
```

チャネルシークレット：LINE Developers > チャネル基本設定　下から2つ目
チャネルアクセストークン：LINE Developers > Messaging API設定　最下部 　から発行
　それぞれに記載されている文字列をそのままコピペして ｀｀ 内に挿入　（注：シングルコーテーションを残す）
　それぞれ、秘密なので、公開禁

4.実行

```terminal
tomoko@MB mylinebot % node app.js
{ 'x-line-request-id': '*****************************' }
```

5.結果
携帯のLINEアプリに　`いっせい送信です`　と　メッセージがきた。
送られた内容は

```app.js
const messages = [{
        type: 'text',
        text: 'いっせい送信です！'
    }];
```

に反映された中身。
今回は、`type: 'text'` なので、テキストメッセージが送られる。

`text` 以外にも、　↑の決まった型（＝メッセージオブジェクト）を変えれば、様々なものを送信できる。
決まった型は、[LINE公式ドキュメント:メッセージタイプ](https://developers.line.biz/ja/docs/messaging-api/message-types/) 参照
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1565008/232bf486-1609-eebd-b938-14e2dd189f52.png)

###　　テキスト以外にスタンプを送信したいとき
公式ドキュメントの　[　Messaging APIリファレンス　](https://developers.line.biz/ja/reference/messaging-api/)にあるように
スタンプや
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1565008/40616b6a-7b30-3ed9-1b26-4078b589cf60.png)
動画も
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1565008/7ab22c54-02c9-8ac7-f202-09d47c1bc208.png)
送ることができる。

ただし、その都度確認しているのも手間なので、LINE Bot Designerを使うと、　↑のjasonを発行してくれる
1. [LINE Bot Designer](https://developers.line.biz/ja/services/bot-designer/)をダウンロード＆インストールしてください。
2. ログイン 
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1565008/6f0da314-52d3-eaff-3cd6-d21b50df6990.png)

＜ハマったところ＞
なぜかLINE　Business IDで登録したメールアドレスとPWでログインできず、困った。
携帯端末にそのメールアドレスとPWを紐つけたら無事ログインできた。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1565008/60aca9b3-8b71-0481-1203-7706ad59691c.png)
「許可する」　を選択

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1565008/346c98b2-00a4-fa43-8cec-e8a691297232.png)
「プロジェクト作成」を選択

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1565008/c8198967-cff4-6be0-f3cf-7d3e95774653.png)
デフォルトのプロジェクト設定のまま「OK」

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1565008/35f06a0b-c7ea-1a31-90b0-f23b7d7637d3.png)
メッセージ>スタンプメッセージを選択して、任意のスタンプを選択すると、

```json
{
  "type": "sticker",
  "packageId": "11537",
  "stickerId": "52002740"
}
```

↑のようにメッセージオブジェクトが自動生成される。

これを 

```app.js
const main = async () => {
　　　　　　　　//↓に埋め込む
    const messages = [{　　
        "type": "sticker",
        "packageId": "11537",
        "stickerId": "52002740"
      }];

    try {
        const res = await client.broadcast(messages);
        console.log(res);
```

のように埋め込むと、選択したスタンプが表示された。
![IMG_8434.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1565008/6b8bd58b-cc83-36fa-b95b-0d34a7156435.jpeg)

なぜ、このように`messages`の内容をかえると様々な表示ができるかというと、　`client.broadcast` というLINEが提供しているライブラリーの関数に`messages`渡すことで処理してくれているから。

因みに、複数個送ることも可能
カンマくぎりで、最大5こまで可能

```app.js

const main = async () => {
    const messages = [
        {
        "type": "sticker",
        "packageId": "11537",
        "stickerId": "52002740"
        }
        , // カンマ区切りすることで、最大5つまで連続送信可能
        {
        type: 'text',
        text: 'いっせい送信です！'
        }
    ];
```



￼