Quantcast
Channel: Node.jsタグが付けられた新着記事 - Qiita
Viewing all articles
Browse latest Browse all 8835

fondesk のメンション機能を Slack Bolt Framework を使っていい感じにした話

$
0
0

はじめに

この記事は前回取材してもらった記事 社内部活動でfondeskのカスタマイズ版とSlackチャンネル「TLけいさつ」を作った僕の野望から技術的な要素をもっと細かく書いたものです

使用技術

なんで作ったか

既に同じような機能をもつ bot はあったけどどれもメンバー表を別で持たないといけなかった
なので都度更新しないといけないかったりする億劫さないしは運用作業が必要になっちゃう。。

e.g.

閃き

Slack のプロフィールと同期してくれたらいいのでは?
と思い、fondesk がいるチャンネルのメンバーのプロフィールを定期的に同期するハンドラーを書きました(Cron)

実装編

HTTP リクエストを実装

Cron をどのようにしようかと迷ってたんですが、今回 PaaS を GAE にしてることもあって
HTTPリクエストを受け取れるエンドポイントを作ることにしました。
Slack Bolt Framework は Express のラッパーなので Express Receiver が使えます
以下のようにしてあっという間に呼び出せます

import{ExpressReceiver}from"@slack/bolt";constreceiver=newExpressReceiver({signingSecret:process.env.SLACK_SIGNING_SECRET,});receiver.app.get(`/register`,(req,res)=>{res.sendStatus(200);// チャンネルメンバーを取得constchannel=newChannel(app);// 更新channel.putChannelMemberFirestore();});

Cron を実装

GAE の場合は cron.yaml を作成します
そして以下のコマンドを打つと cron を設定できます

$ gcloud app deploy app.yml cron.yml

以下は実際に fondeSlackで動かしているものです

cron.yaml
cron:-description:upsert slack profile into firestoreurl:/registerschedule:every 1 hours from 9:00 to 18:00timezone:Asia/Tokyo

image.png

ちょっと困ったこと

Cron の schedule ですが微妙にやりたいことができなかったです
例えば弊社では基本的に受電する機会は平日に限られます。
なので平日の営業時間 9:00-18:00 までが受電する時間帯です
プロフィールの更新作業もこの時間と同じにしたかったのですが、GAE の Cron ドキュメントを見ると、できないようです

↓ こうしたかった...
(平日だけ9:00-18:00に1時間に一回更新)

cron:-description:upsert slack profile into firestoreurl:/registerschedule:every mon tue wed thu fri 1 hours from 9:00 to 18:00timezone:Asia/Tokyo

参考

プロフィールを DB に保存する

今回、DB はさくっと作りたかったので Firestore を使ってます
構成としては、Slack のプロフィールを DB に保存しておいて、fondesk からメッセージがきたら DB と照らしあわせて、対象のユーザの SlackID でメンションする形です

Slack 命名規則だったり除外したいプロフィール項目だったり

プロフィール項目は特定の項目は除外するようにしてます
弊社でいうと部署ですね

image.png

弊社では Slack の本名には命名規則があり、Asato Nago / 名護 朝人のようにしています

image.png

このように会社ごとで命名規則などがあると思うのでその点は調整可能なようにしています
(これは config ファイルなどを別で管理する予定

// 検索対象に含めたくないslackのプロフィール項目名privateIGNORE_CUSTOM_FIELDS_LABEL=["部署"];privatesplitWords=(data:string):string[]=>{if(!data)return[];// チームによってSlackプロフィールの設定ルールがあると思うのでここは区切りたい文字でconstspecialChar=/\/||//;constresult=data.split(/\s+/).filter(item=>item.replace(specialChar,""));console.log({data});returnresult;};privategetCustomFields=(data:fields):string[]=>{if(!data)return[];returnObject.keys(data).flatMap(element=>{constfield=data[element];if(this.IGNORE_CUSTOM_FIELDS_LABEL.includes(field.label)){return"";}returnthis.splitWords(field.value);});};

実際の Firestore Console

駆け足で作ったのと初めての Firestore なので DB 構成などはもっと良くなると思います
何か tips などあればぜひ教えてほしいです

image.png

Event Subscriptions

さて、最後は fondesk からのメッセージから DB に問合せてメンションする処理です
12/2 から fondesk のペリカンアップデートによって Slack の通知方法が変わりました
具体的には 旧い attachment から block kit を使うようになり、とてもみやすい&わかりやすい内容となってました

Before

image.png

After

image.png

なお、コード側では fondesk のメッセージにのみ反応’するようにしています

app.message(/^(.*)/,async({context,message:payload})=>{console.log({payload});if(payload.subtype!=="bot_message"||!payload.blocks||!payload.blocks.length){console.log("🥺 not fondesk message");return;}

誰に対してのメッセージかは正規表現で抜き出し、DB に問合せます
typescript
const splitedText = payload.text.match(/あて先:(.+)\s/);
const targetMember = splitedText.length > 1 ? splitedText[1] : "";
const hitUser = await getFirestore(targetMember);

あとは、複数人ヒットした場合はメンションを追加したり、また誰も見つからなかった場合のみ @hereをつけるようにしたり、メンションすべき人が見つかった場合はスレッドメッセージにしたりしています

誰も見つからなかったとき

image.png

複数人のメンション

image.png

さいごに

先人たちに感謝!
そしてお気軽に PR やイシューを是非お願いします〜
75asa/fondeSlack


Viewing all articles
Browse latest Browse all 8835

Trending Articles