指南
Astro 联系表单（无需后端）
Astro 默认渲染为静态 HTML，这意味着 Astro 联系表单就是一个带有正确 action 属性的普通 HTML 表单。您不需要服务器端点或 Astro 集成 - 把代码片段粘贴到一个 .astro 页面即可。
代码片段
contact.Astro
---
// src/pages/contact.astro
---
<form action="https://formhook.app/f/YOUR_API_KEY" method="POST">
<label>
Email
<input type="email" name="email" required />
</label>
<label>
Message
<textarea name="message" required></textarea>
</label>
<input type="text" name="_gotcha" tabindex="-1" autocomplete="off" hidden />
<input type="hidden" name="_redirect" value="/thanks" />
<button type="submit">Send</button>
</form>工作原理
因为 Astro 默认输出静态 HTML，客户端不需要任何连线。表单的 action 直接 POST 到 formhook.app/f/YOUR_API_KEY，其中 YOUR_API_KEY 来自您 Formhook 仪表盘 中表单的设置。_gotcha 字段是 honeypot - 机器人会填它，人类看不到它，任何含内容的提交都会被静默丢弃。_redirect 字段在 POST 成功后将用户发送到感谢页面，URL 会针对您的允许来源列表进行校验。
之后会发生什么
- 提交一秒内出现在您的 Formhook 仪表盘中。
- 推送通知会在每个您启用了它的设备上触发。
- 从仪表盘直接回复（Pro 及以上），无需暴露您真实的电子邮件地址。
今天就上线您的 Astro 联系表单。
免费注册、创建表单、粘贴 API 密钥。五分钟搞定。
免费开始免费层：5 个表单 · 每月 250 次提交 · 无需信用卡。
Astro 联系表单 - 常见问题
- 我需要 Astro 集成或服务器适配器吗？
- 不需要。表单直接 POST 到 Formhook，因此可与 Astro 默认的静态输出一起工作。无需 SSR 模式，无需 @astrojs/node 适配器。
- 我能在不同的 Astro 页面上有多个联系表单吗？
- 可以。为每个用例创建一个 Formhook 表单 - 联系、招聘、订阅 - 然后将每个表单的 action 粘贴到对应的 .astro 页面。免费层涵盖五个表单。
- 提交后如何显示感谢页面？
- 添加一个隐藏的 _redirect 输入指向您的 Astro 感谢路由。URL 必须在表单的允许来源列表中。如果您更想在不刷新页面的情况下显示内联成功状态，请使用 Next.js 或 SvelteKit 指南中的 fetch 模式。
其他框架的指南
Migrating from Formspree? See how Formhook compares.