Uploads
Handle image uploads and return public URLs back to the builder.
The builder requests uploads through your onUpload callback. Your job is to upload the file and return a public URL.
Example (client)
<EmailBuilder
token="YOUR_TOKEN"
onUpload={async (file) => {
const fd = new FormData();
fd.append("file", file);
const res = await fetch("/api/upload", { method: "POST", body: fd });
if (!res.ok) throw new Error("Upload failed");
const { url } = await res.json();
return url;
}}
/>Example (Next.js route)
// app/api/upload/route.ts
import { NextResponse } from "next/server";
export async function POST(req: Request) {
const form = await req.formData();
const file = form.get("file") as File | null;
if (!file) return NextResponse.json({ error: "Missing file" }, { status: 400 });
// Upload to your storage provider (S3/R2/Supabase/Vercel Blob, etc)
const url = "https://example.com/path/to/uploaded/file.png";
return NextResponse.json({ url });
}Notes
- URL must be publicly accessible (so images can load in the builder preview).
- Validate file type/size.
- Keep extensions when generating filenames.