サーバーレスLINEbotのためにGAS console.log+GCPで開発環境整備をした

要約

初心者がLINE Messaging APIをGoogle Apps Script(以下GAS)で扱おうとして、webhookのエラーやらをlogger.logで記録できなかったためにGCPに突っ込みconsole.logで見たというお話です。

初心者といいましたが、実は、20代後半になって初めてbotを動かすことに成功したというのがこの記事の副題です。また、Google Cloud Platform(以下GCP)については存在も知らない状態からのスタートになります。これまで科学計算を1台のPCでやっていただけの人です。
5時間で終わったので、皆さんも案外すぐに済むかもしれません。この記事があれば30分で済んじゃったりして。いろいろわかる皆さんは課題点を読んだ上で記事を読み、解決方法やそういった記事を残して下さると助かります。するとより良い方法の記事がQiitaに増えるでしょう。

なお、GCPの契約には無料部分はあるものの、ふとしたループなどで容易に支払いの可能性があることに了解して作業してください。ちっぽけな規模のLINEbotでも。

本題

環境

2019/10/24当時
LINE公式アカウント(個人・学生)
LINE Messaging API(フレンド50人以下フリープラン)
windows版LINE ver. 5.19.0.2020
(Android版LINEアプリ ver. 9.17.2 も傍で使用)

OS: Windows 10 Home
browser: Google Chrome 64bit (ver. 77.0.3865.120 Official Build)

GAS: standalone script
GCP: 無料トライアル12か月+300$分クーポンで初期状態、StackdriverとAPIs & Servicesの設定のみ

クレジットカードの存在(GCP契約のため)

作業の流れ

人生で初めてBotを作る人向けにある程度詳しく書いています。これは私が経験した流れとほぼ同じで、違いは常に参照した公式ドキュメントを書いていない点です。残り5時間。

LINE Messaging APIまでの下準備

LINEアカウントを持ちます。公式アカウント作成には個人アカウントとの紐づけが必要です。
LINE公式アカウントを作成します。個人アカウント側からフレンドになり、自動応答メッセージやあいさつなどの動作チェックをしてみます。この時点ではLINE Messaging APIしなくても......できるなら次は終わってます。

LINE Messaging APIの申請

申請します。プランがいくつかありますがお任せします。pushも試せる点で初心者には50人以下フレンドフリープランがいいと思いますが。
そしてLINE Official Account Managerの設定->応答設定から公式アカウントの動作をBotに切り替えます。こいつがLINEbotです。

GoogleDriveにGoogleAppsScriptアプリを導入

googleAppsScriptはSpleadsheets等から開けるものもあるが、webhook用ならば単体で開けるstandalone scriptとして始めるのがいいだろう。そのためにはアプリ自体を導入してそこから開く。
アプリ導入は、GoogleDriveの新規->その他->アプリを追加 から行える。

GAS+LINE Messaging APIの動作チェック

導入したら動作チェック。
慎重ならまずMyFunctionでlogger.log("hello GAS");でも書いてその関数をデバグ、Ctrl+Enterするとloggerに関するログが見れるのを確認しよう。
もう動いてるらしきGAS+LINE Messaging APIのコードと手順が欲しいなら

• Google Apps Scriptでオウム返しLINE Botを作る。
• 次に、LINE謎の開発についてまとめ

がいいでしょう。これらより古い記事はLINE@という終了したサービスについてのものが多く、紛らわしいため記載しない。コードはコピペで十分である…が、LINE Developersでロングタームのアクセストークンを得るのだけは上のサイトが画像付きでわかりやすい(私はアクセストークンの意義と存在を知らず、得るまで2時間消耗している。残り3時間)。

GASをwebhookで使ったときにlogger.logでは残らないのを学び、console.logを知る

Google Apps Scriptのデバッグ方法 をまず読む。この手順は大事だと個人的には感じる。
さて、console.logを使おうとすれば、次のような事故に出遭う…

1. 表示->Stackdriver LoggingやStackdriver Error Reportingを選択しても訳のわからないメッセージボックスが出る
2. いろいろやってもG Suite Developer Hub 自分のプロジェクト 辺りに飛び、エラー数くらいしかわからない

GAS Stackdriverで検索していろいろ出てくるうちで、GASでStackdriverする 2019/4/9~ 以外にはいい記事は見当たらない。読むと

GCPのプロジェクトが勝手に作成されなくなったみたい

Warning: Starting on or after April 8, 2019, the Google Cloud Platform Console won't be able to access the default GCP projects created for new Apps Script projects. Older, existing scripts may have default GCP projects that are still accessible, however. If you have a new script and require access to its GCP project from the Google Cloud Platform Console, you must use a standard GCP project.

https://developers.google.com/apps-script/guides/cloud-platform-projects#switch_to_a_different_google_cloud_platform_project

• GCPプロジェクトを作成する
• GASから　「リソース」「Cloud Platfome プロジェクト...」　でGCPプロジェクトの紐づけをする

正しくは、勝手に作成されなくなってのではなく、GAS作成と同時に作られるdefault GCPプロジェクトがユーザーから触れず、隠れるようになったのである。

以降、この解決のためにGCPプロジェクトを自分で用意し、移行するという作業に入ることになる。
なお、上記リンクはタグ部分が切れているため、URLを残しておく：
Google Cloud Platform Projects #switching_to_a_different_standard_gcp_project
この記事を得るまで2時間。もうあと1時間かからない。

GCPの使用申請

料金等に了解の上、申請します。
請求はされないがクレジットカードの番号を求められます。
(異様に負荷をかけた場合には請求が来るんじゃないかと思っている…が、そこは調べていません)

GCPプロジェクトの下準備

GCPに入ると、既に一つ目のプロジェクトが作成されています。好きなように名前を変更してください。そして、このプロジェクトに移行させることにします。
必要な下準備は

1. Stackdriverの有効化
2. APIs & Servicesの設定

です。どちらも左側のメニューから飛べます。STACKDRIVERの項目のどれかを選び、有効化します。これでStackdriver全体が有効化されます。
ついでに、GCPプロジェクトのホーム画面に戻り、Project Info.のProject Numberを控えましょう。移行時に使用します。

APIs & Services でOAuth consent screenを設定する

APIs & Servicesで必要な設定は、アプリを使用する認証画面のようです。

1. Application nameを設定
2. 他は気にせずSave

これだけで行けました。良いのかは不明です...

GASのdefault GCPプロジェクトから、作ったGCPプロジェクトへ移行

あとは作業です。

1. 当該GAS画面に移動。リソース->Cloud Platform プロジェクトを選択
2. GCPプロジェクト番号に、先ほど控えた番号を入力
3. アプリの認証を求められるので、了解する

このとき、OAuth consent screen設定をしていないと認証できません。
余談ですが、hiddenなdefault GCPプロジェクトはGASの所有者にのみ移行権限があるようなので注意します。

GASからエラー出力画面が開けるかチェック

表示->Stackdriver LoggingやStackdriver Error Reportingを選択してGCPLogViewerのページが出れば成功。
ちなみにconsole.log自体はもちろんエラーではないのでStackdriver Loggingを選択して見てください。

以上で終わりです。調べながらやって5時間でしたので、記事を利用して30分で終わったら嬉しいなと心から思います。

参照した公式ドキュメント

LINE

• Messaging APIの概要
• Messaging APIリファレンス

なお、bot調整はLINE Official Account ManagerとLINE Divelopersがあるが、後者の方がMessaging APIを扱うのに適している。前者はMessaging API有効のbotモードでないときに効果的。

GAS

• Logging
• Google Cloud Platform Projects #switching_to_a_different_standard_gcp_project......超重要。これ見るだけでこの記事の半分は意味がなくなる。
• Overview of Google Apps Script

GCP

• Google Apps Scriptの設定......嘘を言われた記事(最終更新日:3月26,2019とあるもの。GAS仕様変更は2019/04/08なのでout of dateになったようだ)
• Stackdriver 料金

参照したその他サイト

• Google Apps Script 入門
• Google Apps Scriptでオウム返しLINE Botを作る。
• LINE謎の開発についてまとめ......コードはこいつが便利
• 【GoogleAppsScript】ログ出力(デバッグ目的) ......logger.logについてのみ記載
• Google Apps Scriptのデバッグ方法......GCPとconsole.logへの手掛かり。しかし記事が古く、ポップアップ関連は出ない。次の記事がその点の最新。
• GASでStackdriverする 2019/4/9~
• Google Apps Scriptにおける「プロジェクト」の関係......通り一遍終えたらこれを読むとよい

後記

こんなに長く記事を書いたが、下の課題点は致命的過ぎて開発環境整備なんてできていないんじゃないか？と...思わなくもないです。すみません。GCPを使えるようにするのは大変だから記事にしてほしいと友人から依頼があったので、拙い構成だとしても詳細に書かせていただいた次第です。記事を書く方が時間かかってるんだが......

課題点

この組み合わせだとwebhookデバグに時間と手間がとてつもなくかかる。

1. GASでwebアプリケーションとして導入というめんどい作業
2. LINEでbotのwebhookURL更新
3. LINEのやりとりしてテスト、GCP行ってログを確認

を毎回行う方法しか知らない。さらには何が送られてきたのかもわからない...わざわざconsole.log(event);って感じでStackdriver上でjsonを見ている。ばかなのか？
もう少しbotを触りたいのでどうにかしたい。少なくとも、GAS単体のデバグ時にLINEから送られてくるようなjsonデータをあらかじめ用意して突っ込む方法、あるのか？あるなら、何というのか？今こそやり方を知りたい。

編集履歴

191026:投稿