Astro form - SurveyOwl

Astro can submit directly from HTML, so a basic form does not need a client-side framework or API route.

Create the page

Add a page or component such as src/pages/contact.astro. Replace YOUR_FORM_PUBLIC_KEY in the endpoint URL and update the redirect URL.

---
const endpoint = 'https://api.surveyowl.co/v1/submit/YOUR_FORM_PUBLIC_KEY';
---

<main>
  <h1>Contact us</h1>

  <form action={endpoint} method="POST">
    <input
      type="hidden"
      name="redirect"
      value="https://example.com/thank-you"
    />

    <label for="name">Name</label>
    <input id="name" name="name" required />

    <label for="email">Email</label>
    <input id="email" name="email" type="email" required />

    <label for="message">Message</label>
    <textarea id="message" name="message" required></textarea>

    <button type="submit">Send message</button>
  </form>
</main>

The form works as normal HTML after Astro builds the page. The form-specific endpoint URL is intentionally public and may appear in the generated markup; it can accept responses but cannot read them.

Show the result without leaving the page

If you prefer an inline success message, give the form an id and add a client-side <script> that submits it with fetch(). The request is the same as the JavaScript form example.

Test the production page

Submit a response from the deployed domain and confirm it appears in Submissions. If CAPTCHA is enabled, register the production hostname with the provider before testing.