GAS（Google Apps Script）× LINE Bot（Messaging API）で、LINEでの問い合わせ応じて特定の値を返すようにしてみる。

#1．はじめに
前回は、「[GAS（Google Apps Script）で定期的に値を記録](https://qiita.com/jun_higuche/items/76ecaca473addedc65a8)」のプログラムを作ってみましたが、今回は取得した値を**LINEで問い合わせることができるBot**を作ってみます。２章で作ったスプレッドシートを利用して、その値を取得し、返します。


#2．LINE Developersにログインして、Bot用のチャネルを作成

LINE Developersにログインして、Bot用のチャネルを作成する必要があります。

前に書いた記事「『[GAS（Google Apps Script）× LINE Bot（Messaging API）で、何かの値を定期的にLINEに送ってみる』の２章](https://qiita.com/jun_higuche/items/0cfaa9f7466ba6bed469#2line-developers%E3%81%AB%E3%83%AD%E3%82%B0%E3%82%A4%E3%83%B3%E3%81%97%E3%81%A6bot%E7%94%A8%E3%81%AE%E3%83%81%E3%83%A3%E3%83%8D%E3%83%AB%E3%82%92%E4%BD%9C%E6%88%90)」をご参照ください。

これで準備完了です。

#3．簡単なBotプログラムをGASで作ってみる。

本題のプログラムを作る前に、準備運動として、先ほどの「こんにちは」というメッセージに対応して、別メッセージを返すBotプログラムをGASで作ってみます。

準備として、「LINE Developers」に戻って、対象のチャネルの「Message API設定」タブの最下層にある「チャネルアクセストークン」を発行させます。

|![FireShot Capture 183 - LINE Developers - developers.line.biz.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/448092/7b4d959a-847c-7716-8e78-34ee02af6ae2.png)|
|:-:|

「発行」ボタンをクリックすると、結構なランダム文字列のトークンが発行されます。
これは、↓のプログラムで使います。

```Javascript:LineBotTest.gs
// LINE Message API チャネルアクセストークン
var ACCESS_TOKEN = "[チャネルアクセストークン]";
// リプライ用のLINE API
var REPLY = "https://api.line.me/v2/bot/message/reply";

/** 
 * ユーザからのアクションに返信する
 */
function doPost(e) {
  var json = JSON.parse(e.postData.contents);
  
  var postMsg = json.events[0].message.text;
  var replyToken = json.events[0].replyToken;
  var replyText = "";
  
  if(postMsg == "こんにちは") {
    replyText = "こんにちはー！！";
  }
  
  if(replyText == ""){
    return;
  } else {
    // replyするメッセージの定義
    var postData = {
      "replyToken" : replyToken,
      "messages" : [
        {
          "type" : "text",
          "text" : replyText
        }
      ]
    };
    
    // リクエストヘッダ
    var headers = {
      "Content-Type" : "application/json; charset=UTF-8",
      "Authorization" : "Bearer " + ACCESS_TOKEN
    };
    
    // POSTオプション作成
    var options = {
      "method" : "POST",
      "headers" : headers,
      "payload" : JSON.stringify(postData)
    };
    
    return UrlFetchApp.fetch(REPLY, options);      
  }
}
```

![FireShot Capture 206 - GasTest02 - script.google.com.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/448092/d85b5f2e-4225-460d-b0ae-09c8ddee317b.png)


「更新」ボタンをクリックすると、アクセス許可を求められます。
「許可を確認」をクリックして、Googleアカウントの再ログインが求められますので、そこからアクセス許可を行いましょう。

![FireShot Capture 209 - GasTest02 - script.google.com.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/448092/fb8c0e7d-86bc-0ce5-0a77-0537264a8b4a.png)

「LINE Official Account Manager」の「応答設定」で、「Webhook」を「オン」に変更

|![FireShot Capture 197 - LINE Official Account Manager - manager.line.biz.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/448092/515cbabc-5a80-923c-14d4-d55a98a4bca6.png)|
|:-:|

「Messaging API設定」ボタンをクリック

|![FireShot Capture 203 - LINE Official Account Manager - manager.line.biz.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/448092/59c45b30-407f-7a56-04e1-af542b49f7a8.png)|
|:-:|

「Webhook URL」に、GASの公開時に表示されていたURLを設定する。

これでOK。
再度、LINEで、「こんにちは」と打ってみると、、
GASのプログラムで指定した通り、「こんにちはー」っと返ってくるようになりました。

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/448092/02fafeeb-107e-dce1-dff6-e7fd1cf7928e.png" width=50%>


#4．問い合わせに答えるBotプログラムをGASで作ってみる。

ここからが本題です。
「[GAS（Google Apps Script）で定期的に値を記録](https://qiita.com/jun_higuche/items/76ecaca473addedc65a8)」で記録したGoogleスプレッドシートで、「取得シート」と「履歴」のシートを使って、

- LINEから「現在の販売率」と打ち込むと、「取得シート」のその時の販売率（４行目、C列の値）を返す
- LINEから「数日間の販売率遷移」と打ち込むと、「履歴」シートから最新のデータから、最大１０件分の値の遷移を返す

```Javascript:LineBotTest03.gs
// LINE Message API チャネルアクセストークン
var ACCESS_TOKEN = "[チャネルアクセストークン]";
// リプライ用のLINE API
var REPLY = "https://api.line.me/v2/bot/message/reply";

// Googleスプレッドシート
var File = SpreadsheetApp.openById("1MiMP_e0tBSmkZe7Yqx2Fsh5Y7L0C_1NEwLbDEfqcDPg");
var baseSheet = File.getSheetByName("取得シート"); 
var historySheet = File.getSheetByName("履歴"); 

/** 
 * doPost
 * POSTリクエストのハンドリング
 */
function doPost(e) {
  var json = JSON.parse(e.postData.contents);
  
  var postMsg = json.events[0].message.text;
  var replyToken = json.events[0].replyToken;
  var replyText = "";
  
  if(postMsg == "現在の販売率") {
    
    // 現在の販売率を取得
    rate = baseSheet.getRange(4,3).getValue();
    replyText = "現在の販売率は、「" + rate + "％」です。";
    
  } else if(postMsg == "数日間の販売率遷移") {
    
    var historys = [];
    lastRow = historySheet.getLastRow();
    for(var i=lastRow; i > 1; i--){
      
      dayValue = historySheet.getRange(i,1).getValue();
      rate = historySheet.getRange(i,4).getValue();
      
      if(historys.length == 0){
        // まだ1件もない場合には、無条件で追加
        historys.push([dayValue, rate]);
      }else{
        
        if(historys[0][1] == rate){
          // 1つ目の値と比較して、同じ販売率の場合には、日付を更新
          historys[0][0] = dayValue;
        }else{
          // 既に10件に達して居たならばループから抜ける。
          if(historys.length >= 10) break;
          
          // 1つ目の値と異なる販売率の場合には、1要素先頭に追加
          historys.unshift([dayValue, rate]);
        }
      }
    }
    
    replyText =  "";
    for(var i=0; i<historys.length && i<10; i++){
      if(replyText.length != 0){replyText += "\r\n";}
      tmpDate = Utilities.formatDate(historys[i][0], 'Asia/Tokyo', 'MM月dd日 HH時');
      replyText += tmpDate + "～：" + historys[i][1] + "％";
    }
  }
  
  if(replyText == ""){
    return;
  } else {
    // replyするメッセージの定義
    var postData = {
      "replyToken" : replyToken,
      "messages" : [
        {
          "type" : "text",
          "text" : replyText
        }
      ]
    };
    
    // リクエストヘッダ
    var headers = {
      "Content-Type" : "application/json; charset=UTF-8",
      "Authorization" : "Bearer " + ACCESS_TOKEN
    };
    
    // POSTオプション作成
    var options = {
      "method" : "POST",
      "headers" : headers,
      "payload" : JSON.stringify(postData)
    };
    UrlFetchApp.fetch(REPLY, options);      
  }
}
```

「公開」→「ウェブアプリケーションとして導入…」
![FireShot Capture 221 - GasTest02 - script.google.com.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/448092/5a2153d8-48d7-04e6-b2ca-933ab48a629d.png)

※ここで、「外部アクセス」や「Googleスプレッドシート」に対してのアクセス許可を求められる場合がありますので、その場合は、許可を行ってください。

![FireShot Capture 224 - GasTest02 - script.google.com.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/448092/5122a92b-fb87-fc96-f7c3-558c2864ee32.png)

※このURLは、「3．簡単なBotプログラムをGASで作ってみる。」のときに「LINE Official Account Manager」の「Webhook」で指定したものと同じの場合は、再度設定する必要はありませんが、別GASプロジェクトの場合などには、URLが変わりますので、再度設定し直す必要があります。

実際にLINEからメッセージを送ってみましょう。
「現在の販売率」、「数日間の販売率遷移」と打ち込んで、↓のように表示されればOKです。※多少時間が掛かる場合があるようです。

![IMG_3447.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/448092/5b041900-8b85-182b-605c-d0c96a15140d.png)

#5．リッチメニューで使いやすくしてみる。

このままだと、毎回、打ち込んで、問い合わせるのは、少々不便ですし、初めての人はどう打ち込んだらよいのかも分からないため、使い勝手が悪いです。
そこで、ボタンを押すだけで、自動で、メッセージを打ち込んでくれる機能がLINEにはあるのです。
それが、「リッチメニュー」という機能です。

「LINE Official Account Manager」にログインし、「ホーム」→「リッチメニュー」をクリックします。

|![FireShot Capture 227 - LINE Official Account Manager - manager.line.biz.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/448092/43889734-d4d2-fd2d-1f4f-6d2587a3f0cb.png)|
|:-:|

作成ボタンをクリックして、以下の感じで登録します。

|![FireShot Capture 236 - LINE Official Account Manager - manager.line.biz.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/448092/a177d77c-d247-a9a7-cf96-53f3dd0ff809.png)|
|:-:|

「表示期間」は、必須項目のため、何か値を入れないといけません。
無制限にずっと表示させるというのは出来ないみたいです。私が試してみた感じ、最大で17年後の12月31日まででした。

「コンテンツ設定」の「テンプレートを選択」をクリックし、テンプレートを選びます。
![FireShot Capture 230 - LINE Official Account Manager - manager.line.biz.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/448092/53de5641-5052-97d9-e6b6-1f1e85b9763c.png)

「背景画像をアップロード」をクリックすることで、そのテンプレートに合わせて画像をアップロードすることができるのですが、面倒な場合、その下の「画像を作成ボタン」から、↓のように簡単に背景となる画像を作成することが出来ます。
![FireShot Capture 233 - LINE Official Account Manager - manager.line.biz.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/448092/e2886d35-f976-16cc-b8ec-834a38cf09fb.png)

テンプレートや背景画像ができたら、次はアクションを特定します。
今回は、ボタンクリックした際、文字列を表示させいだけなので、「タイプ」には「テキスト」を選択し、それぞれ、「現在の販売率」、「数日間の販売率遷移」と入力します。

|![FireShot Capture 236 - LINE Official Account Manager - manager.line.biz_02.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/448092/8644b540-d2d5-9af6-df17-3ae1bd8bbca5.png)|
|:-:|

ここまで設定できたら、「保存」ボタンをクリックすると、リッチメニューが１つ登録されます。

ここでLINEを再度開いてみると、↓のようにリッチメニューが表示されるようになっているはずです。
それぞれ、クリックしてみると、「現在の販売率」、「数日間の販売率遷移」とメッセージが自動で打ち込まれ、GASからはそれに対応した、メッセージが返されるという形になります。
![IMG_3448.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/448092/8f2a0d4b-87bd-af5b-6a7c-a9a508de9e92.png)
これで、とても使いやすくなりましたね！

#5．まとめ
今回、LINEでの問い合わせに応じて欲しいデータを返すBotアプリをGASで作成できました。さらに、リッチメニューを付加することでとても使い易くなりました。
GAS×LINE Bot これはとても使えそうですねー。すばらしー