// Webmention endpoint must accept cross-origin form POSTs; Astro's default

	// CSRF check (checkOrigin) would reject them with a 403.

	security: {

		checkOrigin: false,

	},

		"parse:birds": "bun run scripts/parse-birds.ts",

		"send:webmentions": "bun run scripts/send-webmentions.ts"

/**

 * Webmention sender.

 *

 * Run after `bun run build`. Scans each built blog post for outbound links,

 * discovers each target's webmention endpoint, and POSTs source+target.

 *

 * State is kept in scripts/.webmention-sent.json so a given source->target

 * pair is only sent once (commit that file to persist across machines/CI).

 *

 * Usage: bun run scripts/send-webmentions.ts [--dry]

 */

import { Glob } from "bun";

import { join } from "node:path";

const SITE = "https://stevedylan.dev";

const SITE_HOST = "stevedylan.dev";

const POSTS_GLOB = "dist/client/posts/*/index.html";

const STATE_PATH = join(import.meta.dir, ".webmention-sent.json");

const DRY = process.argv.includes("--dry");

type SentState = Record<string, string>; // "source|target" -> ISO timestamp

async function loadState(): Promise<SentState> {

	const file = Bun.file(STATE_PATH);

	if (await file.exists()) return (await file.json()) as SentState;

	return {};

}

async function saveState(state: SentState): Promise<void> {

	await Bun.write(STATE_PATH, `${JSON.stringify(state, null, 2)}\n`);

}

// Post URL for the source, derived from the built path:

// dist/client/posts/<slug>/index.html -> https://stevedylan.dev/posts/<slug>/

function sourceUrlFor(path: string): string {

	const slug = path.split("/posts/")[1].replace(/\/index\.html$/, "");

	return `${SITE}/posts/${slug}/`;

}

// Grab only the article body (between the prose container and the

// Webmentions section) so nav/header/footer links are ignored.

function extractArticle(html: string): string {

	const start = html.indexOf("prose-cactus");

	const end = html.indexOf('id="webmentions"');

	if (start === -1) return "";

	return html.slice(start, end === -1 ? undefined : end);

}

function extractTargets(articleHtml: string): string[] {

	const hrefs = new Set<string>();

	const re = /href="(https?:\/\/[^"]+)"/g;

	let m: RegExpExecArray | null;

	while ((m = re.exec(articleHtml)) !== null) {

		try {

			const url = new URL(m[1]);

			if (url.host === SITE_HOST) continue; // skip self-links

			url.hash = ""; // normalize away fragments

			hrefs.add(url.href);

		} catch {

			// ignore malformed URLs

		}

	}

	return [...hrefs];

}

// Discover a target's webmention endpoint via the Link header first, then a

// <link>/<a rel="webmention"> in the body. Returns absolute URL or null.

async function discoverEndpoint(target: string): Promise<string | null> {

	let res: Response;

	try {

		res = await fetch(target, {

			headers: { "user-agent": "stevedylan.dev-webmention-sender/1.0" },

			redirect: "follow",

		});

	} catch {

		return null;

	}

	if (!res.ok) return null;

	// 1. Link header: Link: <url>; rel="webmention"

	const linkHeader = res.headers.get("link");

	if (linkHeader) {

		const found = parseLinkHeader(linkHeader);

		if (found) return new URL(found, res.url).href;

	}

	// 2. HTML <link>/<a rel="webmention" href="...">

	const body = await res.text();

	const re =

		/<(?:link|a)[^>]+rel=["'][^"']*\bwebmention\b[^"']*["'][^>]*>/gi;

	const tag = re.exec(body);

	if (tag) {

		const href = /href=["']([^"']+)["']/i.exec(tag[0]);

		if (href) return new URL(href[1], res.url).href;

	}

	return null;

}

function parseLinkHeader(header: string): string | null {

	for (const part of header.split(",")) {

		const seg = part.trim();

		const relMatch = /rel=["']?([^"';]+)["']?/i.exec(seg);

		if (relMatch && /\bwebmention\b/i.test(relMatch[1])) {

			const urlMatch = /^<([^>]+)>/.exec(seg);

			if (urlMatch) return urlMatch[1];

		}

	}

	return null;

}

async function sendWebmention(

	endpoint: string,

	source: string,

	target: string,

): Promise<boolean> {

	const res = await fetch(endpoint, {

		method: "POST",

		headers: {

			"content-type": "application/x-www-form-urlencoded",

			"user-agent": "stevedylan.dev-webmention-sender/1.0",

		},

		body: new URLSearchParams({ source, target }).toString(),

	});

	return res.ok;

}

async function main() {

	const state = await loadState();

	let sent = 0;

	let skipped = 0;

	let noEndpoint = 0;

	for await (const path of new Glob(POSTS_GLOB).scan(".")) {

		const source = sourceUrlFor(path);

		const html = await Bun.file(path).text();

		const targets = extractTargets(extractArticle(html));

		for (const target of targets) {

			const key = `${source}|${target}`;

			if (state[key]) {

				skipped++;

				continue;

			}

			const endpoint = await discoverEndpoint(target);

			if (!endpoint) {

				noEndpoint++;

				continue;

			}

			if (DRY) {

				console.log(`[dry] would send ${source} -> ${target} @ ${endpoint}`);

				continue;

			}

			const ok = await sendWebmention(endpoint, source, target);

			if (ok) {

				state[key] = new Date().toISOString();

				sent++;

				console.log(`sent ${source} -> ${target}`);

			} else {

				console.warn(`failed ${source} -> ${target} @ ${endpoint}`);

			}

		}

	}

	if (!DRY) await saveState(state);

	console.log(

		`\nDone. sent=${sent} skipped=${skipped} no-endpoint=${noEndpoint}`,

	);

}

main().catch((err) => {

	console.error(err);

	process.exit(1);

});

---

// Renders verified webmentions for the current page.

// Blog posts are statically prerendered, so mentions are fetched client-side

// from the SSR endpoint at /api/webmention?target=<canonical url>.

---

<section

	id="webmentions"

	class="mt-12 border-t border-zinc-200 pt-6 dark:border-zinc-700"

	data-show="false"

	hidden

>

	<h2 class="title text-lg">Webmentions</h2>

	<ul id="webmention-list" class="mt-4 space-y-2 text-sm"></ul>

</section>

<script>

	interface Mention {

		source: string;

		target: string;

		verifiedAt: string;

	}

	async function loadWebmentions() {

		const section = document.getElementById("webmentions");

		const list = document.getElementById("webmention-list");

		if (!section || !list) return;

		const target = `${window.location.origin}${window.location.pathname}`;

		try {

			const res = await fetch(

				`/api/webmention?target=${encodeURIComponent(target)}`,

			);

			if (!res.ok) return;

			const data = (await res.json()) as { mentions: Mention[] };

			if (!data.mentions?.length) return;

			list.innerHTML = "";

			for (const m of data.mentions) {

				const li = document.createElement("li");

				const a = document.createElement("a");

				a.href = m.source;

				a.rel = "nofollow ugc noopener noreferrer";

				a.target = "_blank";

				a.className = "underline hover:text-link";

				try {

					a.textContent = new URL(m.source).host;

				} catch {

					a.textContent = m.source;

				}

				const when = document.createElement("span");

				when.className = "ml-2 text-zinc-500";

				when.textContent = new Date(m.verifiedAt).toLocaleDateString();

				li.append(a, when);

				list.append(li);

			}

			section.hidden = false;

			section.dataset.show = "true";

		} catch {

			// silently ignore — mentions are non-critical

		}

	}

	loadWebmentions();

</script>

// Typed bindings for `import { env } from "cloudflare:workers"`

declare namespace Cloudflare {

	interface Env {

		SESSION: KVNamespace;

		WEBMENTIONS: KVNamespace;

	}

}

import Webmentions from "@/components/blog/Webmentions.astro";

			<Webmentions />

import type { APIRoute } from "astro";

import { env } from "cloudflare:workers";

export const prerender = false;

const ALLOWED_HOST = "stevedylan.dev";

interface StoredMention {

	source: string;

	target: string;

	verifiedAt: string;

}

function isValidHttpUrl(value: string): URL | null {

	try {

		const url = new URL(value);

		if (url.protocol !== "http:" && url.protocol !== "https:") return null;

		return url;

	} catch {

		return null;

	}

}

// KV key groups mentions by target so they can be listed for a given page.

function mentionKey(target: string, source: string): string {

	return `mention:${encodeURIComponent(target)}:${encodeURIComponent(source)}`;

}

// Fetch the source and confirm it actually links to the target, per the

// Webmention spec (https://www.w3.org/TR/webmention/#request-verification).

async function verifyAndStore(

	kv: KVNamespace,

	source: string,

	target: string,

): Promise<void> {

	const key = mentionKey(target, source);

	try {

		const res = await fetch(source, {

			headers: { "user-agent": "stevedylan.dev-webmention/1.0" },

			redirect: "follow",

		});

		if (!res.ok) {

			await kv.delete(key);

			return;

		}

		const body = await res.text();

		if (body.includes(target)) {

			const mention: StoredMention = {

				source,

				target,

				verifiedAt: new Date().toISOString(),

			};

			await kv.put(key, JSON.stringify(mention));

		} else {

			// Source no longer mentions the target — remove any prior record.

			await kv.delete(key);

		}

	} catch {

		await kv.delete(key);

	}

}

export const POST: APIRoute = async ({ request }) => {

	const contentType = request.headers.get("content-type") ?? "";

	if (!contentType.includes("application/x-www-form-urlencoded")) {

		return new Response("Content-Type must be application/x-www-form-urlencoded", {

			status: 400,

		});

	}

	const form = await request.formData();

	const source = form.get("source");

	const target = form.get("target");

	if (typeof source !== "string" || typeof target !== "string") {

		return new Response("Missing source or target", { status: 400 });

	}

	const sourceUrl = isValidHttpUrl(source);

	const targetUrl = isValidHttpUrl(target);

	if (!sourceUrl || !targetUrl) {

		return new Response("source and target must be valid http(s) URLs", {

			status: 400,

		});

	}

	if (sourceUrl.href === targetUrl.href) {

		return new Response("source and target must differ", { status: 400 });

	}

	if (targetUrl.host !== ALLOWED_HOST) {

		return new Response(`target must be on ${ALLOWED_HOST}`, { status: 400 });

	}

	const kv = env.WEBMENTIONS;

	// Verify the source links back, then store, before responding.

	await verifyAndStore(kv, sourceUrl.href, targetUrl.href);

	return new Response("Webmention accepted", { status: 201 });

};

// Read endpoint: list verified mentions for a given ?target= page.

export const GET: APIRoute = async ({ url }) => {

	const target = url.searchParams.get("target");

	const kv = env.WEBMENTIONS;

	const prefix = target

		? `mention:${encodeURIComponent(target)}:`

		: "mention:";

	const list = await kv.list({ prefix });

	const mentions: StoredMention[] = [];

	for (const entry of list.keys) {

		const value = await kv.get(entry.name);

		if (value) mentions.push(JSON.parse(value) as StoredMention);

	}

	return new Response(JSON.stringify({ mentions }), {

		status: 200,

		headers: { "content-type": "application/json" },

	});

};

	"name": "stevedylandev",

	"compatibility_date": "2024-09-23",

	"compatibility_flags": [

		"nodejs_compat"

	],

	"kv_namespaces": [

		{

			"binding": "SESSION"

		},

		{

			"binding": "WEBMENTIONS",

			"id": "f2418ef9b3f84441b25472c784145848"

		}

	]

}