【LINE BOT】30分からできるLINE BOT開発③【メッセージの送信】

こんにちは、ともろう(@tomorrowSLog)です。

この記事は【LINE BOT】30分からできるLINE BOT開発②【GASとLINEボットの紐付け】の続きの記事になります。

メッセージ送信コード
メッセージ送信の仕様
結果
LINE BOTシリーズ他の記事

2019.04.09【プログラミング】日英翻訳サイトを作ってみた【JavaScript】

メッセージ送信コード

アクセストークンの準備

LINE ボットのチャンネル設定をするときに再発行したアクセストークン(ロングターム)を準備しましょう。

フォローイベントコード全文

前回書いたGASのコードを全て消して、以下のように書き換えます。

/*コード.gs*/
var channel_token = "アクセストークン"
var url = "https://api.line.me/v2/bot/message/reply"

function doPost(e) {
  var json = e.postData.contents
  var events = JSON.parse(json).events;
  
  events.forEach(function(event) {
      reply(event);
 });
}

function reply(e) {
  var message = {
    "replyToken" : e.replyToken,
    "messages" : [{
      "type": "text",
      "text" : "ぼくおうむちゃん！"
    }]};
  var options = {
    "method" : "post",
    "headers" : {
      "Content-Type" : "application/json",
      "Authorization" : "Bearer " + channel_token
    },
    "payload" : JSON.stringify(message)
  };
  UrlFetchApp.fetch(url, options);
}

/*コード.gs*/

var channel_token = "アクセストークン"

var url = "https://api.line.me/v2/bot/message/reply"

function doPost(e) {

var json = e.postData.contents

var events = JSON.parse(json).events;

events.forEach(function(event) {

reply(event);

});

}

function reply(e) {

var message = {

"replyToken" : e.replyToken,

"messages" : [{

"type": "text",

"text" : "ぼくおうむちゃん！"

}]};

var options = {

"method" : "post",

"headers" : {

"Content-Type" : "application/json",

"Authorization" : "Bearer " + channel_token

"payload" : JSON.stringify(message)

};

UrlFetchApp.fetch(url, options);

}

メッセージ送信の仕様

全体の流れ

ユーザーがLINEボットを友だち追加したり、メッセージを送ったりすると(イベントを起こすと)、Webhook URLにデータ(HTTPS POSTリクエスト)が送信されます。

そのデータを受け取ったらとりあえず応答メッセージを送るという仕様です。

応答メッセージを送るには、大きく３つの要素が必要になります。

HTTPリクエスト
リクエストヘッダー
リクエストボディ

参考 : Messaging APIリファレンス応答メッセージを送る

1のHTTPリクエストは、これから作成する応答メッセージを送る宛先。

2のリクエストヘッダーは、何語で書かれているかとメッセージを送る許可をえているかというのを明示するもの。

3のリクエストボディは、さらに細かいメッセージの宛先と送る内容。

ざっくり説明するとこんな感じですが、これから実際にコードを見ていきます。

doPost(e)

イベントが起こり、リクエストが送信されるとまず最初にこのdoPost関数で受け取ります。

データはJSONオブジェクトで送られてくるのでその中身を取り出し、うまく取り扱えるように整形(line6,7)

そしてそれをreply関数に渡します。

ちなみにこの段階でのe(event)の中身はこんな感じ。

 {
   "replyToken": "8cf9239d56244f4197887e939187e19e",
   "type": "follow",
   "timestamp": 1462629479859,
   "source": {
     "type": "user",
     "userId": "U4af4980629..."
   }
 }

{

"replyToken": "8cf9239d56244f4197887e939187e19e",

"type": "follow",

"timestamp": 1462629479859,

"source": {

"type": "user",

"userId": "U4af4980629..."

}

reply(e)

この関数でメッセージの送信を行なっていきます。

line15~20で3のリクエストボディの部分を作成しています。

リクエストボディはreplyTokenとmessagesで構成されreplyTokenはdoPost関数で整形したe(event)の中にあるものを(line16)、

messagesはメッセージの形態と内容を記述(line17~20)

メッセージの形態は今回はtextですが、他にもスタンプを送信するときに使うstickerや画像を送るときのimageなどがあります。

参考 : Messaging APIリファレンスメッセージオブジェクト

line21~28で2のリクエストヘッダーの作成を。

何語で書かれているかをline24でメッセージを送る許可を得ているかline25でそれぞれ記述。

line22,27~29で1のHTTPリクエストに適した形にします。

line22はHTTPリクエストの形態を、line27でデータの送信に適した形に戻しline29でメッセージデータを送信という流れ。

line2,3のchannel_tokenとurlを確認してコーディングは終了です。

channel_tokenは準備しておいたアクセストークンを入れてください。

結果

さてコードは全て書き終えましたね。

公開>ウェブアプリケーションとして導入

から、プロジェクトバージョン:new、アプリケーションにアクセスできるユーザー:全員(匿名ユーザーを含む)を指定してボットを更新してください。

承認云々が出てきたら、以下記事を参考にしましょう。

参考 :【初心者向けGAS】スクリプト実行時の「承認」でびっくりしないために

更新が完了したらあとはボットを友達追加するなり、メッセージを送信するなりしてみてください。

可愛いお返事が聞けますよ。

LINEBOTシリーズ他の記事