mattermost botでチャット上にスタンプを流せるようにする。(php)
カスタム絵文字機能から画像を登録して絵文字として使ってみた時、あまりに絵文字が小さすぎて全然使えたものじゃなかった。
そのままの画像の大きさで表示させる機能・・・スタンプ機能が必要だと思いました。
しかしmattermostにはデフォでスタンプ機能がない(slackも同様)ので、ググってみるとみんな色々やっているようです。
でもslackでの事ばっかりでmattermostでやっている人は皆無に等しい!
ということでslackのスタンプ機能実装を参考にmattermostでやってみました。
カスタム絵文字として登録しても小さい画像となってしまって見えない。
参考としたサイト
Slackの絵文字をLINEのスタンプみたいに大きく使えるようにしてみた
最終的な完成形
「?stamp カスタム絵文字コマンド」でスタンプ用のbotを反応させ、png画像を配置しているURLを返してアクセスさせる。
実際にはこう見える。
では手順を説明していきます。
前提となるphp版bot環境の構築
mattermostの環境構築方法(windows)
mattermostのbot環境構築方法(windows)※php版
カスタム絵文字の登録
スタンプ化したい画像をカスタム絵文字として登録する。
画像はpng画像。
カスタム絵文字としての名前は画像の名前。
カスタム絵文字としての名前は画像の名前。
カスタム絵文字として登録後の画面
この状態でmattermostのチャット上に「:thanks:」と入力すれば、絵文字が表示される。
xampp上にスタンプbot用のphpを配置する。
ディレクトリ構成
前回のbot環境構築時のディレクトリと同じ場所に配置する。
「C:\xampp\htdocs\php\phpbotstartup」
stamp.phpとimgフォルダを配置している。
stamp.php・・・スタンプbotの本体
img・・・スタンプとして表示させる画像を入れるフォルダ
画像が格納されている
stamp.phpソース
<?php header("Content-Type: application/json; charset=utf-8"); // 受信文字列取得 if($_POST["user_name"] != "slackbot"){ //mattermostからコマンド文字列を取得 $usertext = $_POST['text']; $query = preg_split('/[\s\x{3000}]/u',$usertext,2); $q = $query[1]; //「:絵文字:」の絵文字の名前だけを抽出している。 $replace = str_replace(':', '', $q); $stampname = $str = rtrim($replace); //画像が格納されているURLを設定する。外部からのアクセスを想定するためIPアドレスを設定する。 $url = "http://XXX.XXX.X.X:28080/php/phpbotstartup/img/"; //png拡張子を設定 $extension = ".png"; //mattermostBotのアイコン、名前を設定 $text = $url.$stampname.$extension; $name = 'Stamp'; $icon = "/static/emoji/1f60e.png"; //mattermostに返すJsonの作成 $payload = array("icon_url" => "$icon", "username" => $name, "text" => $text); echo json_encode($payload); } ?>
githubにソースをあげています。
https://github.com/itouoti12/mattermost_stamp
コメントにもある通り、mattermostに返すURLは外部アクセスからのbot起動を想定するため、localhostではなくIPアドレスを設定する。
また、mattermostBotのアイコンの画像は「C:\mattermost\webapp\dist\emoji」に格納されているので、良い感じのをチョイスする。
botのURLはhttp://localhost:28080/php/phpbotstartup/stamp.phpとなる。
アクセスしてみて、最終的にJsonが表示されていればOK
外向きのウェブフックの設定
「?stamp」コマンドで反応させる設定をする。
トリガーワード:?stamp
コールバックURL:http://localhost:28080/php/phpbotstartup/stamp.php
ウェブフック設定後
今回はスタンプを表示させるbotでしたが、スタンプを登録するbotが無ければユーザが自由にスタンプを登録、使用することができないと思うので、スタンプの登録側のbotも今度作りたいと思います。
――追記――
スタンプ登録用bot作成の記事を書きました。
mattermost botでチャット用スタンプを登録する。(php)
コメントを書く