(GASのアプリケーションが正しく公開されていなかったりBotの設定がわからなかったりして普通に時間かかりました。Qiitaで30分でできたとか書いてる人いるけど絶対嘘だろ!!)

使うもの
  • GAS
  • clasp
  • TypeScript

ローカル開発環境の構築

補完とか使えるので個人的にはローカルで開発することをお勧めします。もちろんGASのエディタを使っても良いです。まずはhttps://script.google.com/home/usersettingsからGoogleAppsScriptAPIをオンにしておきます。 GASAPIの有効化

プロジェクト作成

mkdir gas-project //プロジェクトファイル作成
cd gas-project
npm init -y
npm i -S @google/clasp //claspについては後述
npm i -S @types/google-apps-script @types/node
clasp create --title "GcarenderBot" --rootDir ./src
clasp pull

説明することが2つあるので軽く触れます。

1. clasp

以下のようにGoogle製のCIライブラリであるclaspを使うことでプロジェクトファイルをgitみたいな感じで扱うことができます。clasp createでGASにプロジェクトが登録されます。その際–rootDirオプションでディレクトリを指定しましょう。

clasp create --title "gas-project" --rootDir ./src
clasp pull //GASからpull
clasp push //GASにpush
2. Typescriptへの対応
npm i -S @types/google-apps-script @types/node

地味に嬉しい人多いのでは??clasp pushすれば*.tsから*.jsへコンパイルはGASが勝手にやってくれます。強い。

実装

ローカル開発環境を整えたところで、簡単な実装します。試しにおうむ返しするBotを作ります。LineBotでできることと仕様についてはLineMessagingAPIリファレンスをチェケラ

コード

コードは下記のリンクから拝借したしたものです。ファイル名は適当にcode.tsとかで良いと思います。

var channel_access_token = "各自取得"

function doPost(e) {
  var events = JSON.parse(e.postData.contents).events;
  events.forEach(function(event) {
    if(event.type == "message") {
      reply(event);
    } else if(event.type == "follow") {
      follow(event);
    } else if(event.type == "unfollow") {
      unFollow(event);
    }
 });
}

// 入力されたメッセージをおうむ返し
function reply(e) {
  var message = {
    "replyToken" : e.replyToken,
    "messages" : [
      {
        "type" : "text",
        "text" : ((e.message.type=="text") ? e.message.text : "Text以外は返せません・・・")
      }
    ]
  };
  var replyData = {
    "method" : "post",
    "headers" : {
      "Content-Type" : "application/json",
      "Authorization" : "Bearer " + channel_access_token
    },
    "payload" : JSON.stringify(message)
  };
  UrlFetchApp.fetch("https://api.line.me/v2/bot/message/reply", replyData);
}

/* フォローされた時の処理 */
function follow(e) {

}

/* アンフォローされた時の処理 */
function unFollow(e){

}

アクセストークンはLineDeveloppersの設定から各自取得しましょう。 Image from Gyazo

GASアプリケーションの公開

プロジェクトをclasp pushしたらGASアプリケーションとして公開します。公開した際のURLはWebhook設定の時に使います。

clasp open

でGASを開いて「公開」→「ウェブアプリケーションとして公開」を選択します。以下の点に注意してください。

  • 初回の公開のみ「プロジェクトバージョン」→「New」にする
  • 「アプリケーションにアクセスできるユーザー」→「全員(匿名ユーザーを含む)」

Webhookの設定

続いてLineDeveloppersからBot設定画面を開きます。

  • 「Line@機能の自動応答」→「オフ」にします Image from Gyazo
  • 「Webhook送信」→利用する
  • 「WebhookUrl」に公開したGASアプリケーションのURLを登録

接続確認ができれば実装完了。おうむ返ししてくれましたかと思います。次回はもう少し発展させたものを作ります。

参考URL

毎回言ってる気がするけど先人達に感謝。