Backlogのコメントをメンション効かせてSlackに流すhubotをIBM Cloudで運用してたけど、なぜか急に課金されたのでfirebaseに逃げてきた #Node.js

はじめに

自社の業務システム開発でBacklogを利用しています。
BacklogのコメントをSlackに流すhubotを長らくIBM Cloud(利用開始当時はBluemix)で運用してきましたが、
急に課金されるようになってしまったので、急いでfirebaseに移ってきました。
おかげさまで移行先調査から半日ほどで形になり、2日ほどで完全移行することができました。

この機会にhubot/CoffeeScript から node.js/TypeScriptで新たにし、
githubでfirebase-backlog-slackとして公開もしてみましたので、ご紹介できればと思います。

TL;DR

Backlog/Slackの公式Integrationでも十分です。
でもメンションが効いてると効率が劇的に変わりますよ！

モチベーション

もともとは公式でのSlack連携がなかったので、単純にwebhookを利用してslackに流す用途として使っていましたが、公式の連携ができた後も利用を止めることはできませんでした。主にメンション対応にあります。

公式連携

firebase-backlog-slack連携

Backlogではコメントをお知らせしたいユーザということで指定はできますが、Slackには反映されません。
またコメント内で複数人にコメントしたい場合にも使い分けに困ります。

Slack内でメンション効かせてやりとりするのに慣れていたら、同じ感じでBacklogにコメントできると良くないですか！

別部門/別会社の人とBacklogのプロジェクトを共有していることもあります。
そんな場合にもメンションに変換できると便利です。普通にお堅いやりとりもあります。


山田さん
こちらで合意取れましたので、お願いします。

日々Slackでは膨大なやりとりがあると思います。メールなんてみたくありません。

メンションが効いていれば自分に関係あるかないか、見るべきところがはっきりします。
Backlogのissueでコメントをしていけば、そのissueに対する検討が集約されます。
メンションが効かないと、Slackに来た後はSlack内でやりとりして、後から振り返るの面倒。というのないですか？
検討や対応履歴はBacklogにできるだけ集約しつつ個人間連携を強化しないと人はBacklogにコメントしてくれません！

利用方法

firebaseのCLIはあらかじめインストールしておきます。
ソースを持ってきて各種設定をします。

// ソースをクローンします
$ git clone https://github.com/akiwat/firebase-backlog-slack.git
// 移動して依存パッケージをインストール
$ cd firebase-backlog-slack/functions
$ npm install

// firebaseのプロジェクトと紐付けます。firebaseのプロジェクトは事前に作っておきます
$ firebase use --add

設定ファイルをコピーします。

// slackのincoming webhook, backlogのワークスペース名を定義します。devで別の設定を指定することもできます。編集してください。
$ cp ./env.prod.json.sample ./env.prod.json
$ cp ./env.prod.json.sample ./env.dev.json

中身はこうなっています。
自分の環境に合わせて編集しましょう！
開発用に別のslackのurlを利用する場合は、env.dev.jsonを用意しておけば開発時にはそちらを読み込んでくれます。

{
     "slack_url": "https://hooks.slack.com/services/xxxxx/xxxxx/xxxxxxxxx",
     "backlog_url": "https://xxxx.backlog.jp"
}

次にBacklogとSlackのギャップを埋める設定を編集するため、設定ファイルをコピーします。

// backlogのコメント欄に書かれたメンションをslackのuuidに変換したい場合に設定できます。
// ステータス、
$ cp ./src/config.ts.sample ./src/config.ts

サンプルはこうなっています。
mentionlistは、backlogに書かれた文字列からslackのメンションに変換したいものを指定します。
正規表現も使えるので、名前をタイポしやすい場合は、最小限の文字列で判定すると良いでしょう。（うちはそうしています。）
Backlogを利用する相手にもよりますが、slackのアカウント名だけでなく、他部署・他社とやりとりする際には
山田さん　などとコメントにかかれることもあるでしょうから、そういったものも指定すると便利だったりします。

statuslist は、Backlogのwebhookではステータスのidしかもらえないため、仕方なく変換のテーブルを用意しました。
カスタムステータスなどもidを調べて登録すれば変換できます。
prstatusも同様にPRのステータスを定義しています。こちらはカスタムはなさそうなので、固定です。

export const mentionlist = new Map([
  ['@channel', '<!channel>'],
  ['@here', '<!here>'],
  ['@your[-0-9A-Za-z]*', '<@UXXXXXXXX>'],
  ['あなたさん', '<@UXXXXXXXX>'],
]);

export const statuslist = new Map([
  ["1", '未対応'],
  ["2", '処理中'],
  ["3", '処理済み'],
  ["4", '完了'],
]);

export const prstatuslist = new Map([
  ["1", 'Open'],
  ["2", 'Rejected'],
  ["3", 'Merged']
]);

設定が一通り終わったら、起動してみましょう。

// 開発時起動
$ npm run serve
// 本番デプロイ
$ npm run deploy

起動できたら、Backlogと連携してみましょう。
プロジェクトごとにプロジェクト設定>インテグレーション>Webhookから追加

BacklogへのURLの指定によって、好きなチャネルに投稿することができます。
プロジェクトごとに変えたいときには便利です。

// デフォルト設定、slack側で指定したチャネルに投稿
https://us-central1-{yourproject}.cloudfunctions.net/backlog
// 指定したユーザのslackbotに投稿、動作確認などにも利用できる
https://us-central1-{yourproject}.cloudfunctions.net/backlog?channel=@taro
//　好きなチャネルにも投稿可能
https://us-central1-{yourproject}.cloudfunctions.net/backlog?channel=yourchannelname

いかがでしょうか？

コメントの整形などはやっつけ感が強いので、改善していければと思います。
では！