Налаштування Webhooks та інтеграцій Sanity

Налаштування Webhooks та інтеграцій Sanity

Sanity відправляє вебхуки при змінах документів у Content Lake. Основний спосіб інвалідації кеша ISR, синхронізації з пошуковими індексами та сповіщення команди.

Створення вебхука в Sanity

У sanity.io → проект → API → Webhooks → Add Webhook:

• URL: https://yoursite.com/api/webhooks/sanity
• Trigger on: Create, Update, Delete
• Filter: _type == "post" (тільки потрібні типи)
• Secret: випадкова строка для верифікації підпису
• Projection: { _id, _type, "slug": slug.current } (тільки потрібні дані)

Обробник вебхука у Next.js

// app/api/webhooks/sanity/route.ts
import { parseBody } from 'next-sanity/webhook'
import { revalidateTag, revalidatePath } from 'next/cache'

export async function POST(req: Request) {
  try {
    const { isValidSignature, body } = await parseBody<{
      _type: string
      _id: string
      slug?: string
    }>(req, process.env.SANITY_WEBHOOK_SECRET!)

    if (!isValidSignature) {
      return Response.json({ message: 'Invalid signature' }, { status: 401 })
    }

    const { _type, slug } = body

    revalidateTag(_type)

    const pathMap: Record<string, string> = {
      post: `/blog/${slug}`,
      page: `/${slug}`,
    }

    if (pathMap[_type] && slug) {
      revalidatePath(pathMap[_type])
    }

    return Response.json({ revalidated: true })
  } catch (err) {
    return Response.json({ message: 'Webhook error' }, { status: 500 })
  }
}

Сповіщення в Slack

// Сповістити при публікації статті
// sanity.io → Webhooks → Filter: _type == "post" && defined(publishedAt)

// app/api/webhooks/sanity-slack/route.ts
export async function POST(req: Request) {
  const { isValidSignature, body } = await parseBody(req, process.env.SANITY_WEBHOOK_SECRET!)
  if (!isValidSignature) return Response.json({ error: 'Unauthorized' }, { status: 401 })

  await fetch(process.env.SLACK_WEBHOOK_URL!, {
    method: 'POST',
    body: JSON.stringify({
      text: `📝 Нова стаття опублікована: *${body.title}*`,
      attachments: [{
        text: `https://yoursite.com/blog/${body.slug}`,
      }],
    }),
  })

  return Response.json({ notified: true })
}

Терміни

Налаштування вебхуків для ISR та пошукової індексації — 0,5–1 день.