GASの活用方法及びコードの管理術
概要
何の記事か
Google App Script(GAS)で出来ることや制限、そしてコードのリポジトリ管理についてまとめた記事になります。
こんな方向けの記事
- 非エンジニアでこれからGASを使ってみようと思っている方
- GASでどんなことが出来るかの概要を知りたい方
- GASを用いた開発の制限について把握したい方
- GASのコードをエディタで書いたりリポジトリでバージョン管理したい方
序論
GASは環境構築不要でエンジニアでない方やプログラミング初学者にとっても馴染みやすいアプリケーション開発プラットフォームです。使いこなせるとコスト最小限にバックエンドからフロントまで様々なものが開発可能になります。
GASは参入障壁が低いですが、GASでどういったことが出来るかの勘所から開発における制約、そして開発体験を上げるため方法をある程度インプットしてから技術選定しても遅くありません。なるべくコストを最小限に、そして手軽に開発するためにGASの使用を検討している方々に向けて有益な内容になっていれば幸いです。
GASの開発事例
まずGASを用いて開発する場合の事例を紹介します。
1. Googleサービス上での処理を自動化
GASの最大のメリットはGoogleが提供しているサービスに対して何かしらの処理(値の取得や更新等)が組み込み型のクラスによって簡単に出来るようになっている点です。エンジニアの方は組み込み型のクラスの種類やそれに付随するメソッドなどは公式リファレンスを参考いただくと良いと思いますが、非エンジニアの方は参考書を1冊手元においておくと出来ることの検索に役立つかと思います(個人的にはこれがコードサンプルも多い且つ網羅性高いのでおすすめです)。
Googleサービス上で自動化出来る例としては以下のようなものがあります。
(例)
- Google Drive内で管理している書類をSpreadsheet内でリスト化
- Google Formで回答してもらったメールアドレス宛にGmailで自動返信
- Google Workspace管理のグループアドレスのメンバー自動追加・削除
補足:GASの実行権限について
GASは実行者のGoogleアカウントの権限がそのままプログラムの実行権限となります。例えば、グループアドレス周りをGASで操作するときに使用するAdmin SDK Directory サービスはGoogle WorkSpaceの管理者権限が必要になるので、コードを書くメンバーと作ったアプリケーションを実際に使うメンバーの権限レベルに違いがないかを開発する前に確認することをおすすめします。
2. 外部サービスとのAPI連携
Google外から提供されているAPIを利用し、外部のサービスやアプリなどと連携させることも可能です。1.で挙げたツール例と合わせることででより利便性の高いツールが開発可能になります。
Google系サービスと外部サービスを繋ぎ込んで作るツールの例は以下となります。
(例)
- ツールの処理結果をSlackに通知
- Google Formでユーザーに回答してもらった結果をKintoneに自動登録
- Slackで回答した勤怠をfreeeに自動登録
- Google Analyticsのデータを定期的にNotionのDBに自動登録
- 気象庁から災害情報を取得してSlackでメンバー個別に安否確認を実施
etc…
補足:代表的な外部サービスのAPI
筆者は業務で以下のAPIをよく用いていました。どんなAPIがあってどんなことが可能なのかをある程度目星つけてから開発着手していました。
その他サービスも「{サービス名} API」等で検索するとAPIを提供してくれているかどうかが分かります。そして「{APIメソッド名} GAS」等で検索すると具体的にGASで実装した例が出てくると思います。
補足:API連携する際の注意
APIキー発行の手順やGAS内の認証基盤の作成もサービスごとに異なる上、厳密に言えばシークレットな値(APIキーやOAuthクレデンシャル等)の管理などもあるため、ここらへんは非エンジニアの方は苦しむまたはよく分からず進めてしまう部分かと思います。「{サービス名} GAS」等で検索すればGASのコード例は種々出てきますが、APIキー等は取り扱いを誤ると情報漏えいなどに繋がる可能性があります。不安な場合はエンジニアの方に参考にする記事を見せて作るツールに懸念点がないか相談してみましょう。
3. Webアプリケーション開発
GASを使って作成したプログラムをブラウザ上で動作するWebアプリケーションとして公開することも可能です。GASのファイルは 拡張子が[XXX.gs](http://XXX.gs)
がデフォルトになっていますが、 YYY.html
とすればHTMLも記述できるのでフロントの実装も可能になります。CSSスタイリングはコード内に直接インラインで記述するか、css.htmlファイルを作成して無理やりインポートする方法があります(参考)。
デプロイの際の権限レベルなどを考える必要が出てきて少々難易度が上がってくるので、1.2.の開発が少し慣れてきたときの応用編と捉えておくと良いと思います。
(例)
- Spreadsheetで管理してる社内書籍一覧をWebブラウザで閲覧可能にする
- 別のアプリケーションからGASで作成したコードをエンドポイントとして叩く
GASのLimitation
GASで開発する例を前項で説明しました。バックエンドからフロントまでサーバーを立てずに開発できるとなると何でも出来る割に参入障壁が低く、万能なプラットフォームに見えますが、何が何でもGASで開発するべきではありません。
開発手段にGASを用いるかどうかの判断軸としてGoogle公式が発表してるGASのLimitationを参考にするのをおすすめします。
特にツールを開発後に継続利用していく上でスクリプトランタイム(1度の実行で最大何分までプログラムを動かし続けられるか)を超えないかどうかがGASで開発するかどうかの1つの軸になります。
例えば、全社員の勤怠データの中に異常がないかチェックするようなツールを作ったとします。開発直後は無事に使えていましたが、社員数が増えたある日「起動時間の最大値を超えました」というエラー文が出てプログラムが途中で止まってしまうことがあります。このように継続利用していった先でも開発ツールが動き続けるかどうかの観点もGASを使用する上で大事な知識になります。
スクリプトランタイムの問題を乗り越える手段としては
- パフォーマンスチューニングをして処理負荷を下げる
- トリガーをスクリプトランタイムの限界時間を超えても再帰的に処理を行えるようにする
などのテクニックがありますが、詳細は長くなるのでまた機会あれば別記事にて紹介したいと思います。
GASの開発環境改善
- エンジニアみたいにVScodeで書いてGitHubでバージョン管理してみたい
- GASのGUIでコードを書いているとフォーマッターが無くて辛い
- GASでもTypescriptで型安全なコードを書きたい
- プロジェクトで部分的にGASを使いたい
上記のいずれかに当てはまりそうな方は以下紹介する方法を試していただけたらと思います。最低限のLinux,Gitコマンドを使うことになりますが、Progateレベルのことができれば問題ないので非エンジニアの方もぜひ挑戦してみてください。
非エンジニアorとりあえずバージョン管理したい方向け
claspというGAS向けのCLIツールを導入することでVScodeなどのエディタでGASを書ける上にGithubでコード管理できます。
※ 以下、VScodeやGithubの初期設定は完了しているものとして解説します。
手順1:GASのAPI設定ON
でoff→onにする(開発するGoogleアカウントで実施してください)。
手順2:claspをインストール
iTermやターミナルを開いて以下を実行します。
$ npm install -g @google/clasp
※ npmが入ってない場合「npm not found」などが出てきますがこれを参考に環境に合わせてnpmをセットしてください。
手順3:ファイル管理するディレクトリを作成
$ cd {自分がGASのファイルディレクトリを保存したい場所}
$ mkdir gas_sample // gas_sampleは好きな名前に変える
$ cd gas_sample
手順4:GASファイルをclone
GASファイルはすでに作成してコードを書いたものでも良いですし、新規作成したものでもOKです。以下のスクショを参考にGASからスクリプトIdをコピーしてコマンドを叩きます。すると、コード.gs
などのGASファイルがコード.js
としてファイルにコピーされます。
$ clasp clone {コピーしたスクリプトID}
{手順スクショを載せる}
手順5:コードを書く
VScodeやCursorなどお好きなエディタでコピーされたjsファイルを書き換えます。ファイル名は好きに書き換えてもいいですし、Typescriptで書いてみたい方はXXX.ts
と拡張子を変更してもらっても大丈夫です(が、import等はそのままだと使えないのであくまで型安全に書いてみたいくらいのときにしましょう)。
手順6:実際のGASにコードを反映させる
$ clasp push
成功すると手順5で書いたコードがいい感じに変換されてブラウザ上のGASファイルに反映されます。
※ push対象は .clasp.json
でrootDirに記述されているpathで設定できます。
手順7:GitHubにアップロード
手順4,5で作ったファイル群をpushできれば晴れてGASコードをバージョン管理することが可能になります。
エンジニアの方向け
かつてはGASの開発体験を向上させるために偉人たちが様々なオリジナルパッケージを用意してくれていましたが、23/03ついにgoogle/asideというGoogle公式のGAS開発向けパッケージがリリースされました。前項で解説したclaspがデフォルトで設定されているだけでなく以下のような特徴があります。
-
tsconfig.json
が最初からいい感じに設定されているためTypescriptでの開発が捗る(import文も使える) - フォーマッター(ESLint,Prettier)が構築済み
- テスト開発環境(Jest)が構築済み
- local/productionなどの環境ごとの切り替えが可能
詳しい構築手順はこちらの記事がよくまとまっており私も参考にさせていただいたのでご覧ください。
補足:asideで開発する際の注意
- GAS専用のライブラリを使用すると型エラーが起きる
GASではマニフェストファイルであるappsscript.json
のdependencies.librariesにてGAS専用のライブラリの管理ができます(ファイル直書きでもいいですし、GUI上の「ライブラリ」からID検索をかけることでも可能です)。DayjsやOAuth2などがGAS界隈ではよく使われるライブラリですが、これらをaside環境上Typescriptを用いて開発すると型エラーが発生しデプロイ不可となってしまいます。
# appsscript.json
{
"timeZone": "Asia/Tokyo",
"dependencies": {
"libraries": [
{
"userSymbol": "Dayjs",
"version": "1",
"libraryId": "1ShsRhHc8tgPy5wGOzUvgEhOedJUQD53m-gd8lG2MOgs-dXC_aCZn9lFB"
} // Dayjsをライブラリとして導入した例
]
},
"exceptionLogging": "STACKDRIVER",
"runtimeVersion": "V8",
}
この型エラーの対処は(苦肉の策ですが) global.d.ts
などで以下のように別途型宣言してあげることで回避しています。
# global.d.ts
declare const Dayjs: {
dayjs: any;
};
Dayjsであれば公式がTypescript向けに出してくれているというようなケースもあるので置き換えてもいいですが、あまり凝りすぎるとGASのメリットである手軽さを失ってしまいかねないので、asideは「GASを少しリッチに開発するパッケージ」くらいに留めておくと良いと思っています。
- 複数プロジェクトの開発に向いていない
仮に社内業務効率化のための複数の管理ツールをまとめる1つのリポジトリがあるとして、この中に後入れでasideを導入するとおそらく上手く行きません。asideはデフォルトでは1つのプロジェクトに向けてlocal/production管理をするパッケージとなっているので、例えば「Slackで勤怠打刻できるツール」と「Googleフォームの回答をKintoneに自動登録するツール」の2プロジェクトが混同しているリポジトリ(いわゆるモノリポ)だとそのままの運用は難しくなります。
欲を言えばプロジェクトの度によく使うパーツ(Slack通知機能など)は/utils
などのディレクトリを切って共通に管理したいところですが、そもそも複数プロジェクトの管理に向いていないため1つのasideに1つのプロジェクトという対応関係で開発することをおすすめします。
(package.json
、tsconfig.json
、.clasp.json
をいい感じにカスタマイズすれば複数プロジェクトでも開発できる気がしていますが、誰か良い方法ご存知でしたらコメントでご教示ください。)
まとめ
今回はGASの開発に入る前に参考になりそうな知識を紹介させてもらいました。参入障壁が低い分、細かな制約があったり複雑なことをやろうとするとかえって難易度があがってしまったりと一長一短なプラットフォームです。これからGASで開発しようと思っている方々にとって少しでも有益なものになっていたら幸いです。
今回は具体的なコードやテクニックじみた話は割愛しましたが、今後機会あれば執筆予定なのでお楽しみに。
Discussion