Slack Alerts When a Web Page Changes

# Create a watch whose change-webhook posts to your n8n Webhook node.
# diffMode "visual" = pixel diff + a highlighted overlay; threshold is the
# 0..1 noise floor the diff must EXCEED to count as a change.
curl -X POST https://api.rendex.dev/v1/watches \
  -H "Authorization: Bearer $RENDEX_API_KEY" \
  -H "Content-Type: application/json" \
  -d '{
    "url": "https://competitor.com/pricing",
    "name": "Competitor pricing",
    "intervalMinutes": 1440,
    "diffMode": "visual",
    "threshold": 0.02,
    "webhookUrl": "https://your-n8n.example.com/webhook/rendex-watch"
  }'

# => { "success": true, "data": { "id": "<uuid>", "lastStatus": "queued", ... } }
#
# webhookUrl is a Starter+ feature (email alerts work on every plan).
# intervalMinutes floor by plan: Free 1440 (daily), Basic 180, Starter 60, Pro 30, Enterprise 5
# — a faster value returns 403 WATCH_INTERVAL_TOO_FAST. Baseline capture draws 1 credit.

// Rendex POSTs this to your webhookUrl when a check exceeds the threshold.
// Headers carry the auth signal (identical scheme to job/batch webhooks):
//   x-rendex-event:       "watch.changed" | "watch.recovered" | "watch.error"
//   x-rendex-signature:   HMAC-SHA256 over `${timestamp}.${rawBody}`
//   x-rendex-timestamp:   unix seconds (matches the value signed above)
//   x-rendex-delivery-id: uuid (same across retries — use to dedupe)
{
  "event": "watch.changed",
  "watchId": "6b1c...-uuid",
  "runId": "9af2...-uuid",
  "url": "https://competitor.com/pricing",
  "diffScore": 0.038,
  "diffPixels": 14820,
  "summary": "The Pro plan price rose from $19 to $24 per month.",
  "textDiff": { "added": ["$24/mo"], "removed": ["$19/mo"] },
  "beforeUrl": "https://api.rendex.dev/v1/images/...?sig=...",
  "afterUrl": "https://api.rendex.dev/v1/images/...?sig=...",
  "diffOverlayUrl": "https://api.rendex.dev/v1/images/...?sig=...",
  "cropUrl": "https://api.rendex.dev/v1/images/...?sig=...",
  "changedRegion": { "x": 0.1, "y": 0.42, "width": 0.5, "height": 0.12 }
}

// Post {{summary}} straight to Slack for a text-only alert; attach {{cropUrl}} to
// show just what changed. before/after/overlay/crop are short-lived SIGNED URLs
// (same field names the REST run-history endpoint returns). Re-host for a permanent copy.

// n8n Code node placed right after the Webhook node (set to "raw body").
// Rejects forged callbacks, then builds a Slack message with the diff overlay.
const crypto = require('crypto');

const SECRET = $env.RENDEX_WEBHOOK_SECRET; // stored in n8n credentials/env

const headers   = $input.first().json.headers;
const rawBody   = $input.first().json.body;          // exact bytes as received
const signature = headers['x-rendex-signature'];
const timestamp = headers['x-rendex-timestamp'];

// Rendex signs `${timestamp}.${rawBody}` with HMAC-SHA256 (hex):
const expected = crypto
  .createHmac('sha256', SECRET)
  .update(`${timestamp}.${rawBody}`)
  .digest('hex');

const ok =
  signature &&
  signature.length === expected.length &&
  crypto.timingSafeEqual(Buffer.from(signature), Buffer.from(expected));

if (!ok) throw new Error('Invalid Rendex webhook signature — rejecting.');

// Replay guard (optional): drop callbacks older than ~5 minutes.
if (Math.abs(Date.now() / 1000 - Number(timestamp)) > 300) {
  throw new Error('Stale Rendex webhook (>5 min) — rejecting.');
}

const e = JSON.parse(rawBody);
if (e.event !== 'watch.changed') return []; // ignore recovered/error here

// Shape a Slack "chat.postMessage" payload — overlay image as a block.
return [{
  json: {
    channel: '#market-intel',
    text: `Change detected on ${e.url}`,
    blocks: [
      // The summary is a plain-English sentence — a text-only alert needs nothing else.
      { type: 'section', text: { type: 'mrkdwn',
        text: `*${e.url} changed*\n${e.summary ?? (e.diffScore * 100).toFixed(1) + '% visual diff'}` } },
      // Attach the crop of JUST the change (falls back to the full overlay).
      { type: 'image', image_url: e.cropUrl ?? e.diffOverlayUrl, alt_text: 'What changed' },
    ],
  },
}];