メインコンテンツまでスキップ

GitHubActionsのビルド結果をslack-sendで通知する

概要

このチュートリアルでは、GitHub Actionsとslack-sendを組み合わせて、ビルド結果をSlackに通知する方法を紹介します。

前提条件

本チュートリアルは、下記条件にてサイト運用をしていることを前提とします。

  • Next.js/Nuxt.jsを利用している。
  • KurocoFrontを利用している。
  • GitHub Actionsを利用している。

また、このチュートリアルではslack-sendを利用してslackに通知を行います。 詳細はslack-sendのドキュメントを参照してください。

Slackアプリ設定から通知用アプリを作成する

以下の画面からアプリを作成します。
https://api.slack.com/apps?new_app=1

From an app manifestを選択します。
Image from Gyazo

アプリを追加するワークスペースを選択します。
Image from Gyazo

App Manifestに以下のYAMLを設定してください。
incoming-webhookでSlackに通知を行います。

_metadata:
major_version: 1
minor_version: 1
display_information:
name: github-action-slack-send
features:
bot_user:
display_name: github-action-slack-send
oauth_config:
scopes:
bot:
- incoming-webhook

Image from Gyazo

[Create]をクリックしてアプリを作成します。
Image from Gyazo

ワークスペースにアプリをインストールする

Basic InfomationInstall to Workspaceからワークスペースに作成したアプリをインストールします。 Image from Gyazo

通知するチャンネルを選択します。 Image from Gyazo

アプリが追加できたらInstall appBot User OAuth TokenWebhook URLが追加されているのが確認できます。
Webhook URLはGitHubに登録するのでコピーしてください。 Image from Gyazo

GitHubにSecretsにWebhook URLを追加する

GitHubのリポジトリのページを開きます。
Settings -> Secrets and variables -> ActionsNew repository secretをクリック Image from Gyazo

NameにSLACK_INCOMING_WEBHOOK_URLを設定します。
SecretにコピーしたWebhook URLを設定します。 Image from Gyazo

入力できたら[Add secret]をクリックしてGitHubシークレットを追加します。

Slack通知用のワークフローファイルを作成する

.github/workflows/slack-build-notifier.ymlを作成し、以下の内容を設定。 workflowsにはビルド用のワークフローファイルの name を設定してください。

name: Slack Build Notifier
on:
workflow_run:
workflows:
- Build and deploy to Kuroco front
types: [completed]
jobs:
on-success:
runs-on: ubuntu-latest
if: ${{ github.event.workflow_run.conclusion == 'success' }}
steps:
- uses: actions/checkout@v2
- name: Send GitHub Action trigger data to Slack workflow
id: slack
uses: slackapi/slack-github-action@v1.23.0
with:
payload: |
{
"blocks": [
{
"type": "section",
"text": {
"type": "mrkdwn",
"text": "ビルド成功"
}
},
{
"type": "section",
"text": {
"type": "mrkdwn",
"text": "GitHub Actions: ${{ github.server_url }}/${{ github.repository }}/actions/runs/${{ github.event.workflow_run.id }}"
}
},
{
"type": "context",
"elements": [
{
"type": "mrkdwn",
"text": "Author: <https://github.com/${{ github.event.sender.login }}|@${{ github.event.sender.login }}>"
}
]
}
]
}
env:
SLACK_WEBHOOK_TYPE: INCOMING_WEBHOOK
SLACK_WEBHOOK_URL: ${{ secrets.SLACK_INCOMING_WEBHOOK_URL }}
on-failure:
runs-on: ubuntu-latest
if: ${{ github.event.workflow_run.conclusion == 'failure' }}
steps:
- uses: actions/checkout@v2
- name: Send GitHub Action trigger data to Slack workflow
id: slack
uses: slackapi/slack-github-action@v1.23.0
with:
payload: |
{
"blocks": [
{
"type": "section",
"text": {
"type": "mrkdwn",
"text": "ビルド失敗"
}
},
{
"type": "section",
"text": {
"type": "mrkdwn",
"text": "GitHub Actions: ${{ github.server_url }}/${{ github.repository }}/actions/runs/${{ github.event.workflow_run.id }}"
}
},
{
"type": "context",
"elements": [
{
"type": "mrkdwn",
"text": "Author: <https://github.com/${{ github.event.sender.login }}|@${{ github.event.sender.login }}>"
}
]
}
]
}
env:
SLACK_WEBHOOK_TYPE: INCOMING_WEBHOOK
SLACK_WEBHOOK_URL: ${{ secrets.SLACK_INCOMING_WEBHOOK_URL }}

通知が成功するとSlackに以下のように通知されます。 Image from Gyazo


サポート

お探しのページは見つかりましたか?解決しない場合は、問い合わせフォームからお問い合わせいただくか、Slackコミュニティにご参加ください。