LANG SELRCT

Apps Script Reference  (Create: Create new Spreadsheet | Create new Apps Script

Monday, October 16, 2017

LINE BOTの作り方

Google Apps ScriptでLINE BOTを作る手順をまとめました(2017/10/16現在の情報です)
This article about "Create LINE BOT with Google Apps Script".


Urlfetchなどの利用制限にかからない範囲で個人的に使う分には色々試せると思います

利用制限についてはこちら
Google Apps Scriptの利用制限について

レート制限(LINE APIリクエスト回数・メッセージ受信者数)


今回書いた手順はこんな感じです
  • Google Apps ScriptでBOT用のWebアプリケーションを作る
  • LINE developers画面でMessaging APIをクリックする
  • LINEにログインする
  • 新規channel作成画面で設定する
  • Channel基本設定画面で設定する
  • スマホのLINEでQRコードを読み取る
  • トーク画面でテキストを送信する

これを実際に作っていきます

まずは、Google Apps ScriptでBOT用のWebアプリケーションを作ります
LINEで送信したテキストをそのまま返すということをやってみます
The code below means "return the same message by BOT".


コード.gs
var CHANNEL_ACCESS_TOKEN = "TOKEN";

function doPost(e) {
  var contents = e.postData.contents;
  var obj = JSON.parse(contents)
  var events = obj["events"];
  for(var i = 0; i < events.length; i++){
    if(events[i].type == "message"){
      reply_message(events[i]);
    }
  }
}

function reply_message(e) {
  if(e.message.type == "text"){
  var reply_text = e.message.text;
  var postData = {
    "replyToken" : e.replyToken,
    "messages" : [
      {
        "type" : "text",
        "text" : reply_text
      }
    ]
  };
  }
  var options = {
    "method" : "post",
    "headers" : {
      "Content-Type" : "application/json",
      "Authorization" : "Bearer " + CHANNEL_ACCESS_TOKEN
    },
    "payload" : JSON.stringify(postData)
  };
  UrlFetchApp.fetch("https://api.line.me/v2/bot/message/reply", options);
}
意訳.gs
アクセストークンを設定する

この処理は以下を実行する
送信されたデータの内容を取得し
そのJSONをオブジェクトに変換し
eventsを取得する
eventsの数だけ以下を繰り返す
もしtypeがmessageなら
reply_messageに渡す




この処理は以下を実行する
もし受け取ったmessageのtypeがtextなら
reply_textに入れて
postDataに
replyTokenを設定し
返すmessagesの

typeを設定し
textを設定する




optionsに
methodを設定し
headersに
Content-Typeを設定し
Authorizationを設定し

payloadにはpostDataをJSONに変換したものを設定する

optionをつけてLINEのmessage reply APIをたたく


Google Apps Script側の設定をする

1. スクリプトファイルを新規作成して上記コードを保存します
Create new script file then save the code above.
https://script.google.com/macros/create
↑ここから新規作成できます


2.公開>ウェブアプリケーションとして導入する
Publish > Deploy as web app


3.プロジェクト バージョン:変更内容の説明を入力
次のユーザーとしてアプリケーションを実行:自分(Googleアカウント)
アプリケーションにアクセスできるユーザー:全員(匿名のユーザーを含む)
導入をクリック
Project version: write description
Execute the app as: Me
Who has access to the app: anyone, even anonymous
click Deploy button




4.現在のウェブアプリケーションの URLがこの記事の下の方で設定するLINE BOTのwebhook URLになります
Current web app URL is the webhook URL in LINE BOT settings below.



LINE側の設定をする


1. LINE developers画面で「Messaging API(ボット)をはじめる」をクリックします



2. 利用しているログイン情報を入力して「ログイン」ボタンをクリックします


3. 「Select provider」の下の「」をクリックします



4. 任意の名称(例ではProvider0)を入力して「Add」「Next Page」をクリックします

5.「App icon」「App name」「App description」を設定します

6.「Plan」「Category」「Subcategory」「Email address」を設定して「Confirm」をクリックします
(この記事では扱いませんが、今後push通知もできるようにここでは「Developer Trial」を選択しておきます)

7.利用規約を2つチェックして「Create」をクリックします


8.Channelが作成された後「」をクリックします


9.Channel settingsで「Channel access token」を発行するため「Issue」をクリックし、表示された画面の「Issue」をクリックします


Channel access tokenが発行されます
このtokenをGoogle Apps Script側の CHANNEL_ACCESS_TOKEN に設定します




ここで一度Google Apps Scriptのコード.gsに戻って以下の設定をします

var CHANNEL_ACCESS_TOKEN = "TOKEN";
のTOKENに入れて

公開>ウェブアプリケーションとして導入する
でプロジェクトのバージョンを「新規作成」します


変更内容を任意で(例ではadded TOKEN )入力して「更新します」



10.「Use webhooks」の「編集ボタン」をクリックします

Enabled」を選択し「Update」をクリックします

Webhook URL」の「編集ボタン」をクリックします

webhook URL」にウェブアプリケーションとして導入したGoogle Apps Scriptのウェブ アプリケーションの URLを入力し「Update」をクリックします


11.「Allow bot to join group chat」「Auto-reply messages」「Greeting messages」を任意で編集します



12.スマートフォンのLINEアプリでQR codeを読み取ります

13.友だちを追加で「追加」します


14.追加したBOTのトーク画面へ移動してテキストを送信すると、同じテキストが返ってきます


※テキストが返ってこない場合は以下を試してみてください
「Use webhooks」の「編集ボタン」をクリック > Disabled をクリック > Enabled をクリック > Update をクリック


関連記事

新規作成したLINE BOTが反応しないときに「Webhookの送信」をチェックし直す


参考
Messaging APIを利用するには
https://developers.line.me/en/docs/messaging-api/getting-started/

Latest post

スプレッドシートA列にある複数のテキストをスライドに追加したい(Google Apps Script)

今回Google Apps Scriptでやりたいこと GoogleスプレッドシートA列にある複数の値を取得して Googleスライドに渡して 図形オブジェクトのテキストとして追加したい ① スプレッドシートのA列に値を入れておく ② Code.gsのinsertNewShape...