Page DeltasPage Deltas

ガイド

Zapierやn8nでWebサイトの変更通知を自動化する方法

Page Deltasの変更WebhookをZapierやn8nへルーティングし、CRM、Jira、Notion、メールに連携。AIフィルタリング対応。無料プラン、カード不要。

Page Deltasに重要なことを伝える

HubSpotの価格が変わったら通知して

https://www.hubspot.com/pricing
HubSpotの料金ページ — Professionalプラン、月額792ユーロから
PDPage DeltasApp現在

🔔 https://www.hubspot.com/pricing で変更が検出されました:
Professionalプランの価格が €749/mo から €792/mo に上がりました。

競合他社がProプランの価格を月額29ドルから39ドルへと引き上げたとします。あなたの変更監視ツールがそれを即座に検知しました。しかしその後、担当者が要約を手作業でNotionページに貼り付け、手動でJiraチケットを作成し、Slack経由でスクリーンショットを営業チームに転送しています。そしてディールデスク(営業支援部門)がその情報を把握した頃には、すでに社内チャットや雑談を通じて不正確な噂が広まってしまっています。

この手作業によるコピー&ペーストの工程こそが、情報伝達が滞る原因です。CRMの更新、チケットの起票、定期的な要約配信のために、社内にはすでにZapierやn8nが導入されているはずです。本当に必要なのは、これらの自動化ツールが即座に受信して適切にルーティングできる、Web監視ツールからのクリーンで構造化されたイベントデータです。

私はPage Deltasの開発に携わっているため、以下でVisualpingと比較する際はその点を踏まえてお読みください。Page Deltasは公開Webページを監視し、AIプロンプト(ブリーフ)でノイズを排除し、条件に合致した際に署名付きJSON WebhookをPOST送信します。現在Page Deltasの公式Zapierアプリはありませんが、汎用Webhookチャンネルを使用してZapierのCatch Hookやn8nのWebhookノードへデータを送信し、そこから既存のワークフローへと繋ぐことができます。この記事ではその設定手順を網羅して解説します。

チャット通知だけでは不十分な理由

単一の担当者が変更内容をさっと確認するだけなら、Slack(またはTeams、Discord)で十分です。しかし、同じ変更イベントを3つの異なるシステムへ同時に反映させる必要がある場合、チャット通知だけでは破綻します。営業チームはCRMの取引先レコードに商談メモを残したいと考え、運用チームは変更前後のスクリーンショットを添付したチケットを求め、経営陣は20件の通知に煩わされることなく週次の要約レポートだけを望みます。

これらの連携先をすべて個別に手作業で設定することもできますが、アラートを1つの共通イベントとして扱い、Zapierやn8nにファンアウト(一斉配信)を任せる方がはるかに合理的です。Page Deltasは無料のFreeプランを含め、すべてのプランでSlack、Discord、Teams、メール、署名付きWebhookに対応しています。チャット通知だけで完結する場合は当社のSlack連携ガイドで十分ですが、本記事はアラートを起点として本格的なワークフローを動かしたい場合を対象としています。

VisualpingはZapierやn8n向けの豊富なテンプレートハブを展開しており、全プランでn8nを利用できます。Visualpingの無料プランは5ページ、月間150回のチェック、最短チェック間隔60分でWebhookが利用可能ですが、SlackやTeams連携はBusinessプラン以上が必要です。一方、Page DeltasのFreeプランはクレジットカード不要で、10個の監視URL、ベストエフォート型の無制限チェック、AIによるフィルタリングと要約、さらにSlack、Teams、Discord、メール、Webhookのすべてを網羅しています。ピクセル領域の画像監視を重視するならVisualping、AIによる要約指示やチャット連携の自由度を重視するなら当社をお選びください。

送信されるWebhookのデータ構造

通知チャンネルは組織(Organization)単位で管理されます。新規モニター向けのデフォルトチャンネルを設定できるほか、モニターごとに個別のチャンネルへ上書きすることも可能です。自動化を行うには「Generic webhook(汎用Webhook)」チャンネルを追加し、Catch Hookまたはn8nのURLを貼り付けます。各フィールドの詳細仕様はチャンネル連携ドキュメントで確認できます。

AIによって重要な変更と判定されると、Page Deltasは以下のようなJSONデータをPOST送信します:

POST <your URL>
Content-Type: application/json
X-Signature: sha256=<hex>
{
  "event": "change.detected",
  "monitor_id": "...",
  "monitor_url": "https://example.com/pricing",
  "monitor_name": "競合の料金ページ",
  "change_id": "...",
  "detected_at": "2026-06-01T12:00:00Z",
  "summary": "Proプランが月額29ドルから39ドルに値上げされました。",
  "before_screenshot_url": "https://.../before.png",
  "after_screenshot_url": "https://.../after.png",
  "dashboard_url": "https://app.pagedeltas.com/monitors/..."
}

summary は自然言語で書かれた要約文であり、そのままチケットのタイトルやCRMのメモにマッピングできます。スクリーンショットのURLや dashboard_url は、チケットの添付資料やNotionへの埋め込みリンクとして役立ちます。X-Signature は、チャンネル作成時に一度だけ表示されるシークレット鍵を用いて生成された生のボディデータのHMAC-SHA256ハッシュ値です。JSONをパースする前の生のバイトデータに対してハッシュ計算を行わないと、署名検証に失敗するため注意してください。

通知の配信はチャンネルごとに1回のみ試行され、自動リトライは行われません。受信側サーバーが即座に応答するように設計してください。また、見逃せない重要な監視対象については、Zapierの一時的な障害に備えて異なる種別のサブチャンネル(Webhookに加えてメール通知など)を併用することをお勧めします。

最初にPage Deltas側を設定する

Zapierやn8nの作業に入る前に、まずPage Deltasの監視設定を完了させてください。そうしないと、まだ一度も発火していないモニターに対して空のZapを延々とデバッグすることになります。

  1. 無料アカウントを作成して「Channels」を開きます。人間による確認用としてSlackやメールを追加し、続けて「Generic webhook」チャンネルを追加します。Catch HookのURLがまだ発行されていない場合は、一旦URL欄を空にしておき、後述のZapierまたはn8nの手順完了後に貼り付けます。
  2. 監視対象のWebページ(料金表、変更履歴、採用情報、利用規約、ベンダーのステータスページなど)のモニターを作成します。通知すべき内容と無視すべき変更を指示する簡潔なブリーフを記述してください。フィルター機能のドキュメントで指示の反映方法を解説しています。除外条件を具体的に書かないと、静かなページでもタイムスタンプの更新や関連記事、クッキーバナーなどのノイズを拾ってしまいます。
  3. Webhookチャンネルをそのモニターに紐付けます(または組織のデフォルト設定を利用します)。Catch Hookまたはn8nのURLを保存したら、チャンネルの「Send test」をクリックし、実際の変更が発生する前にデータが正常に流れるか確認してください。
  4. 必要に応じて同じモニターにSlack通知も残しておきます。「人間にはチャット通知、自動化システムにはWebhook」という役割分担は、Zapier経由でSlackへ二重投稿させるよりも運用がすっきりします。

Freeプランでは10個の監視URL(サイトマップは1URL換算)、AIフィルタリングと要約、REST APIおよびMCP連携、無制限のチームメンバー、14日間の履歴保存が含まれます。有料プランではURL上限が拡大されます(Starter: 150件/月29ドル、Pro: 1,000件/月79ドル、Business: 5,000件/月199ドル、Scale: 20,000件/月499ドル、Enterprise: 要相談)。現在は公開ページのみ監視可能で、ログイン認証が必要なページの監視はロードマップで対応予定です。チェック間隔は適応型であり、キュー混雑時は有料プランが優先されます。

Zapierまたはn8nで受信する

どちらのツールもPage Deltasの汎用Webhookチャンネルを利用し、受信側の設定のみが異なります。ZapierではCatch Hookから開始し、n8nではWebhookノードから開始します。

Zapier

  1. トリガーに「Webhooks by Zapier」を選択し、イベントとして「Catch Hook」を指定してZapを作成します。Zapierに表示される専用のWebhook URLをコピーします。
  2. そのURLをPage Deltasの汎用Webhookチャンネルに貼り付けて保存します。Page Deltas画面で「Send test」をクリックします(または実際の変更を待ちます)。Zapierに戻って「Test trigger」を実行し、取得されたテストデータに summary、monitor_url、スクリーンショット等の各フィールドが含まれていることを確認します。
  3. 実行アクションを追加します。典型的な例としては、summary をタイトル、dashboard_url を説明文に設定したJiraやLinearのチケット起票、Notionデータベースへの行追加、HubSpotやSalesforceの競合アカウントへの活動メモ登録、複数変更をまとめたダイジェストメールの送信などがあります。プレースホルダーを手入力するのではなく、Catch Hookのテストサンプルからフィールドをマッピングしてください。
  4. Zapを「On」にして有効化します。Page Deltasからもう一度テスト送信を行い、各アクションが意図通りに実行されることを確認します。

署名検証を行いたい場合、ZapierのCodeステップを使ってリクエストボディのHMACを計算できます。より厳格な検証を行う場合は、生のバイトデータに直接アクセスできるn8nを利用するか、Zapierの前段に軽量なサーバーレス関数を挟む構成をお勧めします。

n8n

  1. Webhookノードを追加してHTTPメソッドをPOSTに設定し、ワークフローをアクティブにしてn8nから本番用URLを取得します。そのURLをPage Deltasの汎用Webhookチャンネルにコピーします(Zapierとn8nの両方で受信したい場合は2つ目のWebhookチャンネルを追加します)。
  2. Page Deltasからテスト送信を行います。WebhookノードにJSONボディと X-Signature ヘッダーが正しく届いていることを確認します。
  3. 任意ですが強く推奨: Codeノードを追加し、チャンネルシークレットを用いて生ボディの sha256= プレフィックス付きHMAC-SHA256を再計算し、X-Signature とタイミング攻撃に安全な方式(timing-safe)で照合します。検証に失敗した不正なリクエストは、CRMやチケット連携ステップに進む前に確実に弾いてください。
  4. 監視ページごとに起票するチケット種別を変えたい場合は、monitor_name や monitor_url の文字列を条件としてIFノードやSwitchノードで分岐させます。その後、通常のWebhookと同様にJira、Notion、メール、HTTP Requestノードを接続します。
  5. ワークフローを保存してアクティブ状態を維持します。Page Deltasは配信失敗時の自動リトライを行わないため、Webhookノードは即座に2xxステータスを返し、時間のかかる重い処理は後続のノードやジョブキューに逃がすように設計してください。

セルフホスト版のn8nは、チャンネルシークレットを社内ネットワークの外に出したくない場合に最適です。クラウド版のn8nは、一般的なマーケティングやRevOpsの自動化フローに幅広く対応できます。どちらの方式でも標準ノードを組み合わせるだけで構築でき、Page Deltas専用の独自コネクタに依存することはありません。

運用の落とし穴と回避策

本番運用を開始すると、いくつか注意すべき点が出てきます。将来的にWebhookのペイロードに新しいフィールドが追加される可能性があるため、未知のキーが含まれていてもイベント全体を拒否せず、単に無視するように実装してください。手動でのテスト再実行によるチケットの重複作成を防ぐには、change_id をべき等性キー(Idempotency Key)として利用します。

Zapierやn8nが2xx以外のエラーコードを返した場合、Page Deltasはその配信を失敗として記録し、処理を終了します。監視モニター自体の稼働はそのまま継続されます。ワークフローが通知を受信しなくなった場合は、アプリ内の配信履歴ログを確認してください。絶対に通知を逃せない重要ページについては、同じモニターにメールやSlackをバックアップ経路として併設しておくのが賢明です。

AIフィルタリングが期待通りに機能するかどうかは、ブリーフ(指示)の具体性にかかっています。「価格の変更を教えて」といった大雑把な指示では、サイドバーの関連記事の更新まで検知してしまうことがあります。複雑な5ステップのZapを構築する前に、無視すべき項目のリスト作成に5分投資してください。また、ログインしないと閲覧できない情報については、現在のところPage DeltasでもWebhookでも検知できません。

当社の製品ファミリーには、他の用途に特化した姉妹ツールもあります。KWatch.io は、特定の単一URLではなくSNSやWeb全体に散らばるキーワードの言及を監視するツールです。決まった公開URLの内容変更を定点観測する場合は、Page Deltasを使いWebhookから自動化を組み上げるのがベストな選択肢です。

まずは1つのZapまたはワークフローから始めよう

まずは1つのページと1つの連携先を選んでみてください。競合の料金変更をNotionデータベースに蓄積したり、ベンダーのステータスページの異常をJiraに起票したりするだけで、連携フローの有効性を十分に実感できます。モニターを作成し、汎用Webhookを登録し、Zapierやn8nでキャッチして summary と dashboard_url をマッピングしてみましょう。Freeプランならクレジットカード不要で、10個のURL、AIフィルタリング、全通知チャンネル、APIアクセスが利用できます。無料で監視を始める。

Julien(Page Deltas プロダクトマネージャー)

Zapierやn8nでWebサイトの変更通知を自動化する方法 · Page Deltas