💬

【Google Apps Script】OpenAI で雑談テーマを生成して Slack に投稿するアプリと GAS ライブラリの作り方

2023/03/07に公開

Slack

こんにちは。kamimiです。

最近は、OpenAI、ChatGPT、Bing AI など〇〇AI がノリに乗っていますね。私も以前一つアプリを作ってみました。

今回はその時の知識を少し生かして、OpenAI を使って Google Apps Script (以下GAS) を実装して Slack App を作ってみました！勢い余って GAS のライブラリ（非公開。訳は後述）も作ってみましたので、その２つの話をしたいと思います。

💬 作ったもの

では早速作ったものからいきます。

背景

最近会社で雑談会を主催しているのですが、テーマがないので何を話したらいいかわからないということもあるかなと思ったんです。なので雑談テーマをあらかじめ用意して、それを元に話すのはどうかと改善を始めてみることにしました。

以前社外のコミュニティで雑談会に参加していたときは、事前にテーマが Slack に投稿されていたので、何を話すのか心の準備ができていました。とてもいいなと思ったので、今回はそれに倣って事前にテーマを準備して Slack に投稿することにしました。

今まで話したテーマも残しておきたかったし、もし話したいテーマがあったら書いて欲しいと思い、用意したのが以下のスプレッドシートです。

普通のよくあるシートだと思います。

あとやることは、翌日分のテーマを Slack に投稿することです。

・・・

自動化できそうですよね。早速しました！というのが今回の話になります。

できたもの

できることは、

「雑談テーマを Google スプレッドシートから取得して、 Slack に投稿する。スプシにない場合は、 OpenAI で生成して Slack に投稿する」

です。OpenAI で生成した場合は、そのテーマをスプシに書き込みます。

シンプル！w

Slack に投稿された時の見た目はこんな感じになります。

制作過程

使用した技術や過程を書いていきます。

使用した技術

GAS
言語
- TypeScript
npm モジュール
- clasp
  - GAS のプロジェクトへのプッシュやプルのため
- @types/google-apps-script
  - Google Apps Script をローカルで書くために必要
- typescript
  - TypeScript で書いているので
API
- Slack API
- OpenAI API

実装

先にリポジトリを置いておきます。README に開発手順やデプロイ方法を記載してありますので、スター⭐の上（だいじ）、cloneしてお好きにお使いください。🙏

TypeScript と clasp

GAS は直接エディタで書くときは、JavaScript です。ですが私は静的付け言語の方が好きなので、 TypeScript で実装してみることにしました。
トランスパイルした後の JavaScript コードはどうやってアップロードするのかなあと思っていたら、clasp という npm モジュールを発見。

https://github.com/google/clasp

Google 公式が出している、Apps Script プロジェクト用の開発ツールです。
こちらがプロジェクトへのアップロードをサポートしていたので使用しました。また GAS には特有の型定義があり、そのままローカルで書いてもコンパイルエラーになってしまいます。

そこで、@types/google-apps-script の npm モジュールも導入します。そうするとローカルでビルドしてもエラーにならず快適です。

Slack の投稿は Block Kit

Slack に投稿するときの UI を折角ならリッチにしようと思い、 Block Kit を使っています。
Block Kit Builderを使っていい感じに好きな UI に組み立てました。

OpenAI の Prompt

ここまで OpenAI の話が出ていません。。が工夫したこととしては人格を持ってくれるように Prompt を調整したくらいです。以下の記事を参考にしています。

とても面白い記事ですね。😊

そのほか

今回それなりに実装が大きくなったので、クラスをいくつか用意していて、それごとにファイルを分けました。
このままデプロイしてもいいのですが、GAS で実行できる関数は１つだけです。なのでどうせなら１つのファイルにバンドルしてしまいたいです。今回はリリース時に必須の npm モジュールは含めていませんが、もし必要になった場合は、モジュールも含めてデプロイする必要があります。
そういうときには Webpack が便利そうです。ただ今回は GAS 触るの初めて、TypeScript もめちゃくちゃ久しぶりということでいっぱいいっぱいになったので、やっていませんw。

ちなみに Slack API に関しては、SlackApp という GAS のライブラリ（Slack 非公式）があり、そちらを使うとすぐに実装できます。が今回は自前で実装しています。

こちらも今回は使用していませんが、TypeScript x Webpack x GAS の開発をしやすいようテンプレートを作ってくださっている方もいました。今後 Webpack を導入するときに参考にさせていただきたいと思います。

🔨 GAS ライブラリの作り方

SlackApp というライブラリを見つけて初めて、「あ！ライブラリなんてあるのか」と気づいたわけですね。Script ID で検索して追加するだけで動くのはとても簡単だなと思い、作ってみました。

GitHub で Script ID を公開しようとも思ったのですが、使い勝手が微妙だったので取りやめました。笑
ただライブラリ化自体はやってみたのでその手順やはまったポイントを書いていきます。

会社の Slack に入れる予定だったのですが、この時は検証も含めて個人の PC で実装していていました。ただ、コピペとは言えこの後会社の PC でも同じコードを置くのはなんだかなあと思っていたので、ライブラリ化を考えました。

手順

GAS プロジェクトの右上から「新しいデプロイ」を選択
「種類の選択」から「ライブラリ」を選ぶ

「説明文」を追加

「デプロイ」を実施
プロジェクトのアクセス権を「リンクを知っている全員」に更新（こうしないと、ライブラリを追加するときにエラーが表示されてしまいます。これにはまった・・・）

これで完了になります。簡単ですね。

当時と UI は変わっていますが、こちらも参考にさせていただきました。

とここでライブラリ化自体の話とはちょっとずれますが、この公開されたライブラリはどこで確認できると思いますか？

それは 「Google Apps Script Library Database」 です。

初めて知りました。いやライブラリを作れること自体初めて知ったのでこちらも知るわけはなかったのですが・・・😅

Google にしては驚きだったのですが、このデータベース、データベースといってもただのスプシです。

ただのと言っては失礼ですが・・・いやデータベースには変わりない！（こういう運用を Google がまだやっているということに少し驚いてしまいました。。）

そしてこのデータベースに載るにはどうしたらいいかというと、、

このフォームから申請をします。（なかなか・・・）
しかもこのフォーム、色々と空白でも通るのかなと思ってたりします。なぜなら、データベースのあちこちが空白だからです。。笑
まあでもせっかく作ったんだから申請は10秒で終わるしやるかと思ってやりました。w

ちなみにこのスプシのライブラリをざっと眺めてみたのですが、今年に入ってからのライブラリの編集履歴を見てみたところ、2023/3/3だったので更新はされている模様です。

申請してみたものの、いつ誰からどうやって連絡が来るのかはさっぱりです。。現時点で申請から2日経っているのですが、まだ連絡はなくデータベースにも載っていません。。

今回はここまでやった時点で前述の理由で非公開にすることにしたので、特に連絡していません。データベースのスプシに連絡先のメールアドレスが載っていたので、どうしても載せたい場合はそちらに連絡するといいかと思います。

ちなみにデプロイをすると、GAS がドキュメントページを生成してくれるのですが、これがまたいつの時代よという感じです・・・
私の場合だとこれです。

が他のライブラリも同じでした。
最初、SlackApp のライブラリのページをみたときは正直「このライブラリ使って大丈夫か？」と思ってしまったのですが、デフォルトがこうなので大丈夫というか・・・GitHub のリポジトリを見てスター数などで判断した方が良いです。まあ他もそうか。

おわりに

以上で、GAS の OSS ライブラリの作り方と共に、今回つくったアプリの紹介をしました。

待ちきれなくて先に記事を書いてしまったのですが、実はこれから会社の Slack に導入してきます！！w これでうまいこと雑談会が回ったらいいなと思っています。

この記事がなんらか皆様のお役に立てれば嬉しいです。😊