カスタムスラックボットを作成する

Sep 10, 2025
操作方法
Create a custom Slack bot
(画像クレジット:Webデザイナー)

スラックは、即座に通信する必要があるビジネスやチームのためのますます一般的なツールです。それが毎日の混乱と見なされるかもしれませんが、それはまた素晴らしい自動化の可能性を持っていて、すべてを一箇所に保つために数十の統合を提供し、それはゆっくりと供給されます。

システムをたるみで統合する方法はたくさんあります。このプラットフォームは、あなたがあなたのリマインダー、またはあなたのデジタルワークスペースを介してメッセージを配信できるブランドのボットを提供します。そしてさらに多くのコラボレーションの機能強化については、これらを試してください クラウドストレージ オプション。

  • デザイナーのための最高のコラボレーションツールの18

スラックは「ボット」と見なすことができるさまざまなエンティティを提供しています。

  • Webhooks、 他のアプリからスラックにメッセージを投稿することを可能にするが、一方向のコミュニケーション形式である。
  • アプリ、 統合の進歩(他のアプリと)の場合
  • ボットユーザー、 まもなくそれらについて。

このチュートリアルでは、特に「ボットユーザー」、それらをプログラムする方法(私たちのガイドをチェックアウトする 最高のコード編集者 あなたの人生をより簡単にするために)そして彼らをあなたのニーズに合わせる。これには、アプリの統合を追加できるスラックスペースにアクセスできるものがあります。まだ1つの一部でない場合は、自由に作成できます。

以下の点で、スラックチャネル内の特定のメッセージに投稿し、特定のメッセージに応答するためのNodeJSアプリを構築します。スラックリアルタイムメッセージングAPIのラッパーである「SlackBots」モジュールを使用します。

ウェブサイトの作りにも興味がありますか?鮮やかなものを選ぶ ウェブサイトビルダー そしてトップ ウェブホスティング それを使うサービス。

01.コードの設定

このチュートリアルでは、ノードがインストールされていることを前提としています。そうでなければ、今そうしてください。それから アセットをダウンロードしてください あなたは必要になるでしょう。チュートリアルの出発点とフレームワークを提供しました。

全体を通して、「slackbots」や 'node-slack-upload'などのモジュールを利用します。それらはinstallコマンドを実行することによって得ることができます。

npm install

02.スラック設定

Create a custom Slack bot: Slack setup

あなたのボットをユーザー名にしてあなたのチャンネルに招待してください (画像クレジット:Webデザイナー)

スラックの「BOTユーザー」統合を使用しています。そうするためには、「https:// lt; youslackworkspace> .slack.com / apps / a0f7ys25r-bots」に行くことでトークンを入手する必要があり、「設定の追加」をクリックしてください。

ボットのユーザー名を選択してください(後でこのプログラムで上書きすることができます)、確認して確認してください。

ボットを希望のチャンネルに招待します。

ボットユーザーを作成することで、次の形式でトークンが取得されます。

XOXB-000000-000000-X0X0XXXXX0XXXX0X

次のステップのトークンをコピーしてください。

03.環境変数

環境変数( '.env'ファイル)を使用して、生成したスラックトークンのように、秘密トークンやキーがあなたのプライベートスラックワークスペースのチャンネル名のように、秘密のトークンやキーを明らかにします。

先に進んで、トークンと「.env」ファイルを入力し、ボットユーザーに招待したチャンネルの名前を入力します。

slack_token = xoxb-<あなたのテクノロン> slack_channel =<チャネル名>

04.ボットパラメータ

この次のステップは、「index.js」に2つのファイルを取得します。これは簡単な表情をし、そして私たちの開発の大部分が起こる「bin / lib / bot.js」を持っています。インデックスファイルでは、「WDMBOT」である名前を付けてボットをインスタンス化します。

'bot.js'では、各インスタンスのパラメータを名前、トークンなどで制御します。

 // index.js.
const bot =要求( './ bin / lib / bot')。init
( 'wdmbot')

//bot.js.
const botparams = {
icon_emoji: ':robot_face:'、
AS_USER:FALSE
;;
ボットを奪う。
関数initbot(botname){
BOT =新しいSLACKBOT({
トークン:process.env.slack_token、
名前:ボトナメ
});)

05.チャンネルへの投稿

Create a custom Slack bot: Post to channel

今、あなたはあなたのボットをメッセージを送ることができます (画像クレジット:Webデザイナー)

「SendMessage」機能を見てください。 'Postto'メソッドを使います。これにより、任意の種類のチャンネル、PublicまたはPrivateへの投稿が処理されます。プライベートチャンネルにのみ投稿したい場合は、代わりに 'Posttogroup'を使用できます(またはPostTochannel 'for Public One)。最初のメッセージを送信するには、 'initbot'にコードを追加できます。

関数initbot(botname){
ボット= / *上記を参照* /
SendMessage( '私はここにいます!');
}
//「NPM Start」を実行してください

06.カスタムボットパーラム

あなたのチャンネルにwdmbotからのメッセージが表示されるべきです。 「BotParams」では、 'AS_USER'がfalseに設定されていることは注目に値します。これにより、名前とイメージを上書きできます。 TRUEに設定すると、トークンを取得するときに設定した名前と画像を使用します。

あなたはBot Emojiをそのような画像に変更することができました:

 const botparams = {
icon_url: 'https://pbs.twimg.com/
profile_images / 976112552081010688 /
wllqvj8d_400x400.jpg '、
AS_USER:FALSE
; 

07.チャネルイベント

Create a custom Slack bot: Channel events

メッセージを聴くためにボットを設定してください (画像クレジット:Webデザイナー)

メッセージの投稿は便利ですが、ボットをよりインタラクティブにするためには、チャネル内の他のユーザーから投稿を識別できる必要があります。メッセージイベントを聴いてから、チャネルに入力したらどうなるかを確認してください。 'user_typing'や 'message'など、さまざまなメッセージタイプがログに記録されているはずです。

関数initbot(botname){
ボット= / *上記を参照* /
bot.on( 'message'、data => {
console.log(データ);
});)

08.着信メッセージに応答する

次に、絶対にすべてに返信することを避けるために、「メッセージ」タイプの着信メッセージ、および特定のフレーズまたはキーワードに返信したいと思います。正確なフレーズと一致したい場合は、必ず小文字の文字列を比較してください。メッセージが特定の単語を含むかどうかを見ることもできます。

 Bot.on( 'メッセージ'、data => {
if(data.type === 'メッセージ'){
if(data.text.tolowercase()=== ''
あなたは?){
SendMessage( '私はここにいます!');
}
}
}); 

09.「人間の」ユーザーに制限されています

BOTユーザーによって送信されたメッセージは、 'bot_message'とbot_idのサブタイプなどのさまざまなプロパティを持っています。あなたが彼らの反応があなたが聞いているキーワードの1つを含まれている場合、あなたは自分自身またはお互いに返信したボットの無限ループを避けるために、人間の投稿されたメッセージのみに返信を制限したいと思うかもしれません。

 Bot.on( 'メッセージ'、data => {
if(data.type === 'メッセージ'&&データ。
サブタイプ!== 'bot_message'){
if(data.text.tolowerCase()。
含まれています( 'hello')){
SendMessage( 'こんにちは、私はボット!');
}
}
}); 

個人化された応答

より個人化された応答を与えるには、返信しているメッセージのユーザーIDを活用できます。 SLACKは、タグ '< @ @>'に囲んでいるときにIDを自動的にユーザー名に変換します。特に複数のチャネルメンバーがあなたのボットと同時に対話している場合、あなたが返信している人を識別することができます。

 Bot.on( 'メッセージ'、data => {
if(data.type === 'メッセージ'&&データ。
サブタイプ!== 'bot_message'){
if(data.text.tolowercase()。
含まれています( 'hello')){
sendMessage( 'hello< @ $ {data.user}
>私はボットです! ')。
}
}
}); 

generate CSS

あなたがあなたのクライアントの仕事、キャリアまたは代理店を次のレベルに連れて行くために最新の創造的で実践的なスキルを学びたいのなら、Generate CSS - Webデザイナーと開発者向けのCSSに焦点を当てた会議で私たちに参加してください。もっと調べてください ここに 。特別オファーコードを使用してください WebDesigner2. チケットの10%割引の場合! (イメージクレジット:getty /未来)

11.応答を更新します

ボットは彼らの反応を編集することもできます。ただし、自分だけです。それで、あなたが間違いを発したときにあなたのメッセージを自動的に訂正する能動点のボットを望んでいるならば、それは現在の設定では不可能です。

メッセージを更新するには、新しい機能と、デモで使用するグローバルブール値を定義します。

 Changerply = Falseにしましょう。
関数updateMessage(MessageParams){
Bot.UpdateMessage(MessageParams.channel、
messageParams.ts、messageParams.text、
ボットパラム)。

12.メッセージを変更してください

Create a custom Slack bot: Changing the message

ボットが送信するメッセージを更新します (画像クレジット:Webデザイナー)

ボットが私たちを送るテキストを更新しようとしましょう。この場合、メッセージイベントでは、入ってくるボットメッセージに返信する必要があるため、更新の条件と一致します。また、元のメッセージのタイムスタンプも更新されます。それはスラックであるかが他のユーザーがインから投稿された場​​合にどのメッセージを更新するかを識別することができます。

(data.type === 'メッセージ'& data.subtype!==
'bot_message'&& data.text){
if(data.text.includes( 'update')){
SendMessage( '5で更新します
秒 ');
changerply = true;
}
}
if(data.type === 'メッセージ'&& data.subtype ===
'bot_message'&&チェンジレペリー){
Changerply = false;
SetTimeout(()=> {
UpdateMessage({channel:data.channel、
TS:Data.ts、テキスト: '私は'}を更新しました。
5000···}。

13.エフェメラルメッセージ

Create a custom Slack bot: Ephemeral messages

一時メッセージは1人のユーザーによってのみ見られ、削除することができます (画像クレジット:Webデザイナー)

一時的なメッセージは、一時的なメッセージが示唆される可能性があります。それらは1人のユーザーにとってのみ見え、それらによって削除することができます。これらのタイプのメッセージは、恒久的に滞在する必要がないチップまたはリマインダーとして役立つかもしれません。

(data.text.tolowerCase()IF( 'hr')){
EpheMerrMessage({
チャンネル:Data.Channel、
ユーザー:Data.user、
テキスト:「HRに連絡する必要がある場合は、
彼らのEメールは[email protected]です
});)
}

//呼び出す機能
関数EpheMerrMessage(MessageParams){
Bot.Postephemerer(MessageParams.channel、
messageParams.user、messageparams.text、
ボットパラム)。

14.ユーザールックアップ

さまざまなメソッドが、わずかに異なるユーザーパラメータ(DISPLAY_NAMEとREAL_NAMEとは異なります)のいずれかがわかります。ただし、メッセージイベントではユーザーIDだけが利用可能です。したがって、すべてのユーザーを取得してIDを一致させることで、ユーザー名の検索を実装できます。

 Async関数getUserName(userID){
await bot.getUsers()を返す
。3(データ=> {
member = data.merbers.find.
(user => {
return user.id === userid;
});)
return member.name;
)
.catch(err => console.log(err))。

15.直接メッセージを送る

新しいユーザー検索では、エフェメラルメッセージがしない場合は、ユーザーに直接メッセージを送信できるようになりました。直接メッセージは、元のチャネルとは異なるIDを持つ、新しい/異なるチャネルと見なされます。以前に完了したユーザーと同じ方法でチャネル検索を実装することもできます。

 //メッセージイベントに
if(data.text.tolowercase()。( 'bot')){
senddm({
ユーザー:Data.user、
テキスト:「どのように私は助けることができますか?」
});)
}
//呼び出す機能
非同期関数SENDDM(MessageParams){
getUserNameをuser = await hale at aute
(messageparams.user);
return bot.postmessagetouser(ユーザー、メッセージ
params.text、botparams、(err、data)= gt; {
console.log(err)
});)

16.画像で応答します

BOTユーザーには、ファイルや画像をチャンネルにアップロードする権限もあります。この機能は 'slackbots'でカバーされていませんので、以下で説明されているように、新しいアップローダをインスタンス化する必要があります。プロジェクトのrootにある「資産」フォルダを準備し、その中にいくつかの画像を使用します。

次のステップで定義された「sendImage()」への呼び出しを準備しましょう。

 // initbot()
Uploader =新しいslackupload(process.env。
slack_token)。

//メッセージイベントに
if(data.text.includes( 'image')){
if(!data.upload){
/ *この場合、メッセージはありません
サブタイプ、
だから私たちはそれが引き起こされていないことを確認します
前のアップロードメッセージ* /
image = data.text.Split( '')
。 SendImage( 'これはimage you 募集 '、イメージ); }

17.ファイルアップロード機能

Create a custom Slack bot: The file upload function

アップロードするファイルシステムとファイルシステムを使用して画像をアップロードします (画像クレジット:Webデザイナー)

アップローダとファイルシステム(FS)モジュールを使用して画像をアップロードします。ユーザーのメッセージが「image< imagemename.extension>」という形式である場合、そのようなファイルは 'Assets'フォルダに存在します、画像は読み取られてアップロードされます。そうでなければ、通常のメッセージを送り返します(それは一時的なものでさえあるかもしれません)。

関数sendImage(メッセージ、イメージ){
uploader.UploadFile({
file:fs.createReadStream(path.join.
(__ dirname、 '../../ast / redukitimage}')))
MimeType: 'image / *'、
ファイルの種類: '*'、
タイトル:画像、
InitialComment:メッセージ、
チャンネル:チャネル
}、(err、data)= gt; {
if(err){
SendMessage(すみません、見つかりません
$ {image} ');
}
});)

18.複数のチャンネルに投稿します

応答を期待している各チャンネルのメンバーである限り、同じボットユーザーを持つ複数のチャンネルに投稿できます。 'PostOlAll'関数を作成し、環境変数をコンマ区切りの値として持つように環境変数を更新しましょう。

const channels = process.env.slack_channel。 スプリット('、'); const channel =チャンネル
; 関数PostToAll(メッセージ){ Channels.Foreach(チャネル=> { bot.postto(チャンネル、メッセージ、ボトパラム); });)

19.チャンネルを分割する

時折、デバッグのためにチャネルを使用するか、さまざまなチャンネルの同じボットとは異なるイベントに応答することをお勧めします。チャンネルの命名規則を調整するのはあなた次第です。次の例では、slack_channel = wdm-tutorial、wdm-tutorial-debugを想定します。

関数スプリッサセッション(メッセージ、デバッグマッサージ){
Channels.Foreach(チャネル=> {
const msg = channel.includes( 'debug')
debugmessage:メッセージ;
bot.postto(チャンネル、MSG、ボトパラム)。
});)

20.応答の辞書

メッセージに直接対応する応答を強く符号化してきました。今後も物事をより管理できるようにするには、データベースまたはJSON形式のどちらかでトリガーや応答を保存し、Metの条件に応じて切り替えることができます。

 //応答項目の例
{
入力: 'hr'、
InputMatch: 'include'、
応答:「あなたがhrに連絡する必要がある場合、
彼らのEメールは[email protected]です。
ResponsStype: 'エフェメラル'

21.さらなるリソース

Create a custom Slack bot: Further resources

他の場所に見つけるにははるかに多くのボット情報があります (画像クレジット:Webデザイナー)

SLACK APIには、他にも有用なプロパティがいくつかあります。うまくいけば、このチュートリアルでは、すべてのボットニーズにとって何が可能なのかの概要を説明しています。さらにリソースを読むことによって見つけることができます 'slackbots'ドキュメント 、または完全な Slack APIのドキュメント

この記事はもともとCreative Web Design Magazineの第289号に発行されました ウェブデザイナー ここに発行する289を購入してください または ここでWeb Designerを購読してください

関連記事:

  • AI-Powered Chatbotを構築します
  • スラックは大量のアップデートをしました、そして、あなたはすべてそれを愛するつもりです
  • チャットボット体験をデザインする方法

操作方法 - 最も人気のある記事

FormikでReact Form Stateを管理する

操作方法 Sep 10, 2025

(イメージクレジット:マット・クラウチ) FormikでReact Form Stateを管理する方法につい�..


Artrage 5で表現力豊かな肖像画のアートをペイントする

操作方法 Sep 10, 2025

ARTRAGEは人気のあるデジタルアートツールです。 ar ar はじめにこのチュートリアルで�..


Chart.jsを使用してデータをインタラクティブダイアグラムに変える

操作方法 Sep 10, 2025

ページ1/2: チャートを使う:ステップ01-10 チャートを..


Reactでダッシュボードアプリを作成する方法

操作方法 Sep 10, 2025

ページ1/2: React 1-10でダッシュボードアプリを作成します ..


プライマーを使ってあなたのパステルにテクスチャを追加する方法

操作方法 Sep 10, 2025

using パステルプライマー あなたの芸術のための表面を作成することは、紙よりも作�..


ナイフツールをマスター

操作方法 Sep 10, 2025

あなたのスキルを更新することができ、あなたが知っていない、あなたが今までに気付いていな..


Mayaでポータル効果を作成する

操作方法 Sep 10, 2025

Dr Strangeのポータル効果はとても特別でした。これは、このように視覚的効果よりもモーション�..


Unreal Engine 4でゲーム環境を作成する

操作方法 Sep 10, 2025

私のUnreal Engine 4プロジェクトを使用して最後の停止を例として、ビデオゲームの生産のためのリ..


カテゴリ