Headless API & MCP
Developer Tools & EngineeringHeadless AI Blogging with Next.js, REST APIs, Signed Webhooks, and Model Context Protocol (MCP)
How engineering teams integrate autonomous content pipelines into Next.js and Astro apps using REST APIs, HMAC-SHA256 webhooks, and Claude MCP tools.
On this page▸
A headless blog API decouples editorial research, AI drafting, and quality scoring from your frontend presentation layer. With PixelClaw's REST API, HMAC-SHA256 signed webhooks, and Model Context Protocol (MCP) server, engineering teams can fetch typed content blocks into Next.js or trigger AI blog workflows directly from Claude.
Should you use a hosted custom domain or a headless blog API?
When software engineers set out to add a blog to a Next.js or SaaS application, their first instinct is often to wire up MDX files in git or build a custom database table. Two months later, the marketing team is blocked waiting on pull requests just to fix a typo or update an Open Graph image.
Before writing custom frontend code against a headless blog API, ask whether a hosted custom subdomain (like blog.yourdomain.com) already solves your problem. PixelClaw's hosted blogs provide Cloudflare TLS, Guide/Editorial/Premium layouts, automatic JSON-LD, sitemap.xml, llms.txt, and 10-language translations with zero engineering maintenance.
Choose the headless REST API and webhooks when your blog must live inside an existing application shell, share client-side authentication state, or embed interactive React product widgets directly inside article bodies.
How does the PixelClaw REST API structure posts and blocks?
Authenticated with your blog API key in the Authorization: Bearer header, PixelClaw's v1 API exposes clean endpoints for posts, media, taxonomies, and OpenAPI schema discovery:
- GET /api/v1/posts — Paginated list of published or draft posts with metadata, excerpts, and timestamps.
- GET /api/v1/posts/:id — Full post payload including the versioned array of typed content blocks.
- POST /api/v1/posts — Programmatically create a new post from your own internal pipelines.
- GET /api/v1/media & GET /api/v1/taxonomies — Retrieve uploaded media assets, categories, and tags.
- GET /api/v1/openapi — Machine-readable OpenAPI 3.1 specification.
Hosted custom domain vs headless REST API vs MCP agent workflow
Compare the three ways technical teams deploy and operate PixelClaw:
| Architecture | Setup Time | Best For | How Discovery & Caching Work |
|---|---|---|---|
| Hosted Custom Domain | 5 minutes (1 CNAME) | SaaS, D2C & agencies wanting zero frontend maintenance | PixelClaw serves HTML, JSON-LD, sitemap.xml, feed.xml & llms.txt at the edge |
| Headless REST API + Webhooks | 1 to 2 hours | Next.js / Astro apps needing custom in-app components | Fetch /api/v1/posts; revalidate cache on HMAC-SHA256 webhook events |
| MCP Server (/mcp) | 2 minutes in Claude | Founders & devs triggering research/drafts from AI assistants | Streamable HTTP with Bearer API key; 12 non-destructive tools |
How to verify HMAC-SHA256 webhooks for Next.js cache revalidation
Polling an API on every page request wastes latency, while static builds go stale when an editor updates an article. PixelClaw solves this by sending real-time HTTP POST webhooks whenever a post is published, updated, or unpublished.
Verify the X-PixelClaw-Signature header in your Next.js App Router route handler before calling revalidatePath or revalidateTag:
import { createHmac, timingSafeEqual } from "node:crypto";
import { revalidatePath } from "next/cache";
import { NextResponse } from "next/server";
export async function POST(request: Request) {
const sigHeader = request.headers.get("x-pixelclaw-signature") ?? "";
const rawBody = await request.text();
const parts = Object.fromEntries(sigHeader.split(",").map((p) => p.split("=")));
if (!parts.t || !parts.v1) return NextResponse.json({ error: "Missing signature" }, { status: 401 });
const timestamp = Number(parts.t);
if (!/^[0-9]+$/.test(parts.t) || !Number.isSafeInteger(timestamp) ||
Math.abs(Math.floor(Date.now() / 1000) - timestamp) > 300) {
return NextResponse.json({ error: "Invalid or expired timestamp" }, { status: 401 });
}
const expected = createHmac("sha256", process.env.PIXELCLAW_WEBHOOK_SECRET!)
.update(`${parts.t}.${rawBody}`)
.digest("hex");
const valid =
expected.length === parts.v1.length &&
timingSafeEqual(Buffer.from(expected), Buffer.from(parts.v1));
if (!valid) return NextResponse.json({ error: "Invalid signature" }, { status: 401 });
const payload = JSON.parse(rawBody);
revalidatePath("/blog");
if (payload?.data?.slug) revalidatePath(`/blog/${payload.data.slug}`);
return NextResponse.json({ ok: true });
}How does the Model Context Protocol (MCP) server work?
If your workflow lives inside Claude Desktop, Claude Code, or another MCP-compatible assistant, you can connect directly to https://pixelclaw.ai/mcp over Streamable HTTP using your blog API key.
Once connected, your assistant can inspect existing posts and categories, look up topic ideas, check your workspace credit balance, kick off SERP research, generate an outline, and draft a scored post—all from a single conversation without touching a browser tab.
- Engineering teams should never build custom WYSIWYG editors, SERP scrapers, or SEO linters inside their core product repository.
- Compare two integration paths first: pointing a custom subdomain (blog.yourdomain.com) takes five minutes with zero code, while the headless blog API gives full control over custom Next.js routes.
- PixelClaw's REST API returns structured, Zod-validated content blocks (headings, paragraphs, tables, FAQs, keyTakeaways, citations) alongside pre-rendered HTML.
- Signed webhooks (X-PixelClaw-Signature with timestamp + HMAC-SHA256) let Next.js apps trigger on-demand ISR cache revalidation the moment a post publishes.
- The MCP server at https://pixelclaw.ai/mcp exposes 12 non-destructive tools so Claude and other MCP-compatible agents can list posts, check credits, and start AI research and drafting.
Frequently Asked Questions
Which PixelClaw plans include the REST API, webhooks, and MCP server?+
The Developer REST API, HMAC-SHA256 signed webhooks, and the Model Context Protocol (MCP) server at /mcp are included on Pro, Agency, and Enterprise plans. Custom domain hosting is available starting on the Starter plan.
Does the headless blog API return raw Markdown, HTML, or structured JSON blocks?+
GET /api/v1/posts/:id returns structured JSON content blocks—including heading, paragraph, image, table, bulletList, orderedList, callout, keyTakeaways, faq, code, cta, internalLink, and citation blocks—so your frontend can render custom React components or use the standard HTML representation.
How do I prevent replay attacks on PixelClaw webhooks?+
Every webhook request includes the X-PixelClaw-Signature header formatted as t=<unixtimestamp>,v1=<hexhmacsha256>. Compute the HMAC-SHA256 over '<t>.<rawrequestbody>' using your endpoint's signing secret, compare digests with timingSafeEqual, and reject timestamps older than 5 minutes.
Can an AI assistant delete my blog posts through the MCP server?+
No. By design, the 12 tools exposed on PixelClaw's /mcp server can read and create posts, list pages, topics, categories, models, and credits, and start or follow AI research and drafting jobs—none of the MCP tools can delete content.
Where can I find the OpenAPI schema to generate TypeScript types?+
Send a GET request to /api/v1/openapi to retrieve the complete OpenAPI 3.1 specification for automated client and type generation.
Sources
- Model Context Protocol (MCP): Streamable HTTP Transport Specification — Model Context Protocol (Defines how AI assistants like Claude authenticate and invoke remote tools over HTTP.)
- OpenAPI Initiative: OpenAPI Specification v3.1.0 — OpenAPI Initiative (Standard machine-readable REST API contract format used by PixelClaw's /api/v1/openapi endpoint.)
- IETF RFC 2104: HMAC — Keyed-Hashing for Message Authentication — IETF (Cryptographic specification underlying X-PixelClaw-Signature HMAC-SHA256 webhook verification.)
Built & scored using PixelClaw.ai
More from this blog
Continue exploring autoblogging architecture, AI blog writing, and SEO / AEO / GEO playbooks.
Best Autoblogging Tools in 2026: Hosted, WordPress and Agent Options Compared
Autoblogging tools come in three shapes: a hosted blog that writes itself, a writer that auto-posts to your WordPress site, and an SEO agent that runs everything. Seven tools compared, with prices from each vendor's site.
PixelClaw Editorial Team
Product and search team
The Complete llms.txt Guide: How to Configure Your Blog for GPTBot, ClaudeBot, and PerplexityBot
Why AI agents struggle with JavaScript-heavy marketing sites, how the llms.txt specification works alongside robots.txt and sitemap.xml, and how to set it up automatically.
Marcus Vance
Head of Growth Architecture
Scaling B2B SaaS Organic Pipeline: How Programmatic Autoblogging Drives 10x More Qualified Demos
From thin comparison pages to definitive technical authority: How modern B2B SaaS engineering and marketing teams win across Google Search, Perplexity, and Gemini AI Overviews.
Marcus Vance
Head of Growth Architecture