Astro - Postboi

Postboi is framework-agnostic: read the request’s FormData in an API route and hand it straight to mail(). Postboi extracts the special fields and renders the rest into a tidy HTML table.

// src/pages/api/contact.ts
import type { APIRoute } from 'astro'
import { mail } from 'postboi'

export const POST: APIRoute = async ({ request, redirect }) => {
	await mail({ body: request.formData() })
	return redirect('/?sent=1', 303)
}

// src/pages/api/contact.ts
import type { APIRoute } from 'astro'
import { mail } from 'postboi'

export const POST: APIRoute = async ({ request, redirect }) => {
	await mail({ body: request.formData() })
	return redirect('/?sent=1', 303)
}

Point a multipart/form-data form at the route. Include hidden _subject and _reply_to fields, and mirror the email into _reply_to with a one-line oninput so replying reaches the sender:

<form method="post" action="/api/contact" enctype="multipart/form-data">
	<input type="hidden" name="_subject" value="Contact Form" />
	<input type="hidden" name="_reply_to" />
	<input name="contact→name" placeholder="Name" required />
	<input name="contact→email" type="email" required
		oninput="this.form._reply_to.value = this.value" />
	<textarea name="details→message" placeholder="Message"></textarea>
	<button type="submit">Send</button>
</form>

<form method="post" action="/api/contact" enctype="multipart/form-data">
	<input type="hidden" name="_subject" value="Contact Form" />
	<input type="hidden" name="_reply_to" />
	<input name="contact→name" placeholder="Name" required />
	<input name="contact→email" type="email" required
		oninput="this.form._reply_to.value = this.value" />
	<textarea name="details→message" placeholder="Message"></textarea>
	<button type="submit">Send</button>
</form>

Field names use the fieldset→field syntax. API routes need SSR, so set output: 'server' with an adapter in astro.config.mjs. The provider and default recipient come from postboi.config.ts: a POSTBOI_TOKEN routes to the Postboi provider, or pick any provider.

Or use the Captcha component

postboi/astro ships the spam protection (honeypot plus, on the Postboi provider, the managed invisible captcha) as a single prop-free component. Your form stays a native <form>; just drop it inside:

---
import Captcha from 'postboi/astro'
---

<form method="post" action="/api/contact" enctype="multipart/form-data">
	<!-- your fields… -->
	<Captcha />
	<button type="submit">Send</button>
</form>

---
import Captcha from 'postboi/astro'
---

<form method="post" action="/api/contact" enctype="multipart/form-data">
	<!-- your fields… -->
	<Captcha />
	<button type="submit">Send</button>
</form>

The publishable key is baked in by bunx postboi sync. See Spam protection.

Runnable example: examples/astro-provider-postboi.