Loading page
either $fetch from the component or a Nitro server route that forwards the payload.
// server/api/contact.post.ts
export default defineEventHandler(async (event) => {
const body = await readBody(event);
const response = await $fetch.raw("https://formivo.faizyab.me/api/f/YOUR_FORM_ID", {
method: "POST",
headers: { Accept: "application/json" },
body,
});
return { ok: response.status === 201 };
});
// components/ContactForm.vue
async function submit() {
const result = await $fetch("/api/contact", { method: "POST", body: { email, message } });
state.value = result.ok ? "sent" : "error";
}The Nitro route returns your own shape; the upstream endpoint answers 201 or an error.
| Symptom | Fix |
|---|---|
| CORS error | Call the Nitro route instead of the endpoint directly. |
| Body is undefined | Use readBody(event) in the server route. |