メインコンテンツにスキップ

Webhook通知を設定する

StudioでWebhook通知を設定し、サイトの公開・更新・非公開時に外部システムへリアルタイムに情報を連携する方法を説明します。各プロジェクトにつき1つの通知URLを登録できます。

一週間前以上前にアップデートされました

注意:外部ツール利用時のご案内

この記事の内容には、外部ツールの機能・操作が含まれます。

Studioサポートポリシーに基づき、記事内でご案内している手順以外の仕様や動作についてのご質問は、チャット窓口でサポート対象外となる場合があります。

通知の概要

Studioでは、以下のタイミングでWebhook通知を送信します。

Webhookは、1プロジェクトにつき1つのURLのみ設定できます。


Webhookを有効にする

次の手順でWebhook通知を設定できます。

  1. プロジェクトダッシュボードの[全体設定]にアクセスします。

  2. [Webhookの編集]をクリックします。

  3. 通知を受け取るシステムのエンドポイントURLを入力し、[保存]をクリックするとWebhookが有効化されます。

  4. 有効化後に[テスト送信]をクリックし、動作を確認します。


Webhookを無効にする

通知を停止するには、以下の手順を実行します。

  1. プロジェクトダッシュボードの[全体設定]にアクセスします。

  2. [Webhookの編集]をクリックし、設定されているエンドポイントURLを空欄にして[保存]をクリックします。

  3. 保存後、ステータスがOFFに変わることでWebhookが無効化されます。


実行時の挙動

通知条件を満たした場合、Studioは設定されたURL宛に次の内容でPOSTリクエストを送信します。

  • Content-Type: application/json

  • User-Agent: Studio-Webhook

  • Body: {JSON}

送信されるJSONの例:

※読みやすいように改行を入れていますが、実際には1行で、プロパティ名と値の間には空白は入りません。

{
"project_id": "xxxx",
"project_name": "テストプロジェクト名",
"event": "site-published",
"user_id": "xxxx",
"user_name": "xxx xxx",
"dashboard_url": "https://app.Studio.design/projects/xxxxx",
"publish_url": "https://example.com",
"timestamp": 1711582925
}

各項目の内容は以下のとおりです。


プロパティ名

内容

project_id

プロジェクトを一意に識別するID

project_name

プロジェクトの名称

event

通知イベント名。site-published(公開)、site-updated(更新)、site-unpublished(非公開)のいずれかです

user_id

操作を行ったユーザーのID

user_name

操作を行ったユーザー名

dashboard_url

対応するStudioプロジェクトダッシュボードのURL

publish_url

公開サイトのURL

timestamp

UNIXタイムスタンプ形式の実行時刻


Slackのincoming webhookを使用する

Slackのincoming webhook URLをStudioに登録すると、通知イベントに応じて自動でSlackへの通知が送信されます。

Slack通知の内容は、Webhookを設定したStudioユーザーの言語設定に基づいて表示されます。

設定方法の詳細は、Slack Developers > Slack API クライアント > incoming webhooks(外部リンク) を参照してください。

通知の例(サイト公開・更新・非公開時):

こちらの回答で解決しましたか?