エンジニア

Slack通知を作る時は Slack App を使ってみよう

投稿日:

はじめに

こんにちは。東京スタジオでクライアントエンジニアをしている菅原です。
みなさん業務やプライベートでSlackbotを作ってリマインド通知を飛ばしたりしませんか?たまにしますよね。
Slackに投稿する機能を使いたい場合、Incoming WebHooksを使うことになると思います。

ただ、メニューのCustom IntegrationsからIncoming WebHooksへ飛ぶと、(2年前くらいから)以下のようなアラートが出ています。
ざっくり言うと、「この方法は非推奨で削除される可能性があるので、Slack Appsを使うことを推奨します」ということのようです。

弊社はかなり初期からSlackを使用しているのもあり、Incoming Webhooks が旧方式で作成されているbotも多いのですが、新方式(Slack App)でもやってみましょうというのが目的の記事です。

メリット&デメリット

先に、それぞれのメリットとデメリットを書いておきます。

旧方式

メリット
・設定が楽
・1つのWebhook URLから、json設定次第で、どこのチャンネルにも通知を飛ばせる/usernameやアイコンが変更できるなど、自由度が高い

デメリット
・自由度が高い分、セキュリティリスクが高い
・非推奨機能

新方式

メリット
・1つのWebhook URLからは、1つのチャンネルにしか通知を飛ばせない = セキュリティリスクが低い
・どこで使われているかが追いやすい
・推奨機能

デメリット
・少し設定が面倒
・usernameやアイコンの変更は大元の設定以外では不可

Slackで通知をさせたい時: 旧方式

比較のために、旧方式のやり方も書いておきます。

Custom Integrations -> Incoming WebHooks へ遷移し、追加します。

次のページでチャンネルを設定します。

インテグレーションの追加を押下した後に、Webhook URLが表示されるので、それをメモして使います。
メリットデメリットの項に記載した通り、ここでチャンネルを選択はさせられますが、飛ばし方のオプションによっては別チャンネルにも飛ばせます。

Slackで通知をさせたい時: 新方式

次に、新方式でのやり方です。

https://api.slack.com/apps にアクセス、「Create New App」を押下します。

今回は From scratch で行います。

名前と、appを所属させるワークスペースを選択して CreateApp します。

CreateAppした後のページで色々設定していきます。
※2021/12現在、古いUIと新しいUIが混在しているようなのですが、ページ上部に出ている、以下のお知らせをクリックするとこの記事の画像の見た目になると思います。
(ただ古いUIの方がわかりやすいものもあるかもしれません。現在は左のメニューからリバートもできるようなのでやりやすい方でいいと思います。)

設定ページはこんな感じです。

アイコンを設定したりします(今回諸事情で休肝日botを作っています)。

何はともあれ、Incoming Webhooks をOnにします。

その後 Add New Webhook to WorkSpace をしたいのですが、

押下すると、インストールできませんと言われます(ハマりポイント)。

これは、Manifestに、bot_userのdisplay_nameを設定すると解決できます。旧UIだとUI上から設定できます。

display_nameの設定をしたら、Incoming Webhooks 画面に戻って、今度こそ Add New Webhook to WorkSpace します。
どこに追加するのか聞かれるので、チャンネルを選びます(後からチャンネルの追加は可能です。追加した分のWebhook URLが生まれます)。

上記が成功すると、Webhook URLが追加されるので、それをメモして利用してください。

自分はGASを使った連携をよくやります(詳細は割愛)。
例:

// テスト投稿
var SLACK_WEBHOOK = "上記のWebhook url";
function testPost() {
    var message = "testだよ";
    postMessage(message, SLACK_WEBHOOK);
}

// 投稿
function postMessage(message, hookPoint) {
  var payload = {
    "text": message,
    "unfurl_links": true,
  }
  var options = {
    "method" : "POST",
    "payload" : JSON.stringify(payload),
    "muteHttpExceptions": true,
    "headers": {
      "Content-type": "application/json",
    }
  }
  var response = UrlFetchApp.fetch(hookPoint, options);

  if (response.getResponseCode() == 200) {
    return response;
  }
  return false;
}

testPostを実行すると、選択したチャンネルに以下が投稿されます。

できましたね。

今回はやりませんでしたが、読み書きや検索など、他のスコープをbotにつけたい時に、Appに紐づける形で追加することも可能です。

おわりに

新方式のほうがちょっとめんどくさいな...と思った方もいるかもしれません。
ただ、セキュリティ面や作りの正当性を考えると、新方式のほうが妥当なのかなと思います。
蛇足ですがDiscordなどでも、1つのWebhook URLからは1つのチャンネルにしか通知を飛ばせない仕様になっています。
そろそろ新方式に慣れてみてはいかがでしょうか。

それでは、年末年始、飲酒機会も増えるかもしれませんが、コロナ禍のリモートワークで運動不足が加速している方も多いと思いますので、何卒健康には気をつけてお過ごしください。

採用情報

ワンダープラネットでは、一緒に働く仲間を幅広い職種で募集しております。

-エンジニア
-, ,

© WonderPlanet Inc.