esa.ioからMattermostへのWebhook送信を試してみた

はじめに

esa.io の Webhook 送信先として Mattermost が選べるようになったので試してみました。
ReleaseNotes/2018/06/21/Discord・Microsoft Teams・Mattermost への Webhook を追加しました - docs.esa.io

使用している Mattermost のバージョンは Mattermost v5.1.0-rc1 になります。

Mattermost の設定

まず、Mattermost 側に esa.io からの Webhook を受け取るための内向きのウェブフックを作成する必要があります。

Mattermost のメインメニューから統合機能を選択します。

統合機能のメニューから内向きのウェブフックを選択し、内向きのウェブフックを追加するボタンを押します。

ウェブフックを作成する際に必須の項目はタイトルと、通知を投稿するチャンネルのみですので、この２つは必ず指定してください。その他の情報は必要に応じて指定してください。
入力か完了したら保存するボタンを押します。

<img src="https://qiita-image-store.s3.amazonaws.com/0/9891/cb8bbc85-1c2f-5b2e-3cba-e265868eccab.png" width="70%">

すると、新しい内向きのウェブフックが作成されるため、表示されている URL をコピーしておきます。

これで Mattermost 側の設定は完了です。

esa.io の設定

次に esa.io の設定を行います。

https://{team}.esa.io/team/webhooksよりウェブフックのメニューを開き、Add webhookボタンを押します。
<img src="https://qiita-image-store.s3.amazonaws.com/0/9891/8f5bb3d1-7175-5352-98eb-09576bab04bd.png" width="70%">

ウェブフックのメニューからMattermostを選択し、Incoming Webhook URLに、先ほどコピーした Mattermost の内向きのウェブフックの URL をペースとします。
Label やチェックボックスなどは必要に応じて変更してください。今回は投稿を作成した際に通知が飛ぶようにするため、**on post create (only ShipIt)**にチェックをしています。
<img src="https://qiita-image-store.s3.amazonaws.com/0/9891/d0fe802e-a680-43e4-c95f-3fc731a4046f.png" width="50%">

Saveボタンを押してウェブフックが作成されたら esa.io の設定も完了です。

<img src="https://qiita-image-store.s3.amazonaws.com/0/9891/eb4d663f-ec6d-804a-f251-e0c0df8e980e.png" width="70%">

通知の確認

esa.io 側のウェブフックの設定を行なった段階で、Mattermost へ通知が飛びます。
Mattermost で内向きのウェブフックを作成した時に選択したチャンネルを開いてみましょう(\( ⁰⊖⁰)/)。
<img src="https://qiita-image-store.s3.amazonaws.com/0/9891/ce0af763-27bc-b89d-3f3e-1c6eb494e707.png" width="100%">

次に、esa.io 側で新しい投稿を作成し、ShipItします。
<img src="https://qiita-image-store.s3.amazonaws.com/0/9891/03168f23-5f3f-37f0-ecfa-d2e1d9758345.png" width="70%">

すると、Mattermost の方に通知が飛びます。
<img src="https://qiita-image-store.s3.amazonaws.com/0/9891/46b29361-b612-49ea-57ca-388d6d3eb7a5.png" width="100%">

投稿されるメッセージは esa.io 側のChange logの内容のようです。
リンクになっているesa.ioへの通知テストをクリックすると、esa.io で作成された投稿へ飛ぶことができます。