Slack で絵文字を追加するサービスを作ろうとしたときに調べたこと

Slack で絵文字を追加するサービスを作ろうとしたときに調べたこと

はじめに

Slack に絵文字を追加するWebサービスを開発しようと思い、調べた内容をまとめます。

開発しようとしているサービスは Slack の絵文字を管理し、ワークスペースに一括 import できるサービスです。個人的には絵文字の重要度を高く捉えており、コミュニケーションにおいてテキスト以上に情報量があります。例えば、「良いと思います」よりも「良いと思います👍」の方が相手が受け止めやすいと感じます。前者だと冷徹さ高圧的な印象を自分は感じてしまうのですが、後者では一転して肯定メッセージと素直に受け取ることができます。

このようなサービスを開発しようとしているのですが、調べてみるとSlackの絵文字追加まわりが複雑な状態になっていたので一旦まとめます。

1.絵文字を1個ずつ追加する

最初に絵文字を1個ずつ追加する方法を紹介します。

1個ずつ追加する方法は2つあります。1つ目は公式のSlack APIを利用する方法です。2つ目はSlackの非一般公開APIを利用する方法です。

上手く言語化できないが、後者は筆者にとって少し抵抗があります。非公開にしているということはもちろん外部から使用されることを想定しておらず、何かの理由で訴えられても文句は言えないです。しかし後者の非公開APIを公開にしてほしいとの GitHub issue で立てられていたりと、非公開ながら認知度はある程度あるように感じます。

1-1 Slack API の admin.emoji.add の利用

1つ目の方法は、王道に Slack API を利用する方法です。

admin.emoji.add API method
Add an emoji.

この方法は1つ欠点があり、それは Admin 権限の API トークンが必要なことです。具体的には admin.teams:write 権限が必要であり、この権限はワークスペースを変更することができます。

たかだか絵文字を追加するために Admin 権限を渡すのは非常にリスキーです。また、そもそもAPIキーの登録が必要な事自体、ユーザーからしたらハードルが高いです。

王道な方法ではあるのですが、このAPIを元にサービスを組み垂れるのは現実性が低いように思います。

1-2 非一般公開APIである /api/emoji.add の利用

2つ目の方法は Slack の非一般公開の API を利用する方法です。

この方法は以下のようなプロダクトでも使用されています。

方法としては、 /api/emoji.add というエンドポイントを使用します。実際に叩くパラメータや実装例は Natural Face Emoji Tools のコード がわかりやすいので参考にしてみて下さい。

このエンドポイントでは xoxs と呼ばれている専用トークンを渡す必要があります。こちらも方法が2つあるので紹介します。

CSS セレクタから API トークンを取得

この方法は Natural Face Emoji Tools で使用されています。コードはこの部分です。

document.querySelectorAll でコードを取得し、正規表現で値を取得しています。

window.boot_data.api_token から API トークンを取得

この方法はオブジェクトから直接 API トークンの値を取得します。decomoji で使用されており、コードはこの部分です。

2.絵文字を複数追加する (できない)

なんとSlackには絵文字を複数追加する方法がありません。まとめて追加したい場合、1個ずつ追加するAPIを複数回叩くこととなります。

こればっかりは方法が用意されていないので諦めるしかありません。

終わりに

非一般的APIを利用するかは個人の判断に任せますが、今回はここまでとしたいと思います。

Slack さんには以下の2点をお願いしたいです。

  1. Slack API に 絵文字の bulk insert API の追加
  2. せめて Admin ではなく最低レベルの権限で叩けるように

参考文献