# บทเรียน 03 — เพิ่ม contact form ส่งถึงอีเมลจริงด้วย FormSubmit

เว็บเกิดแล้ว แต่ยังเป็น “หน้าอ่านอย่างเดียว” บทนี้เพิ่มช่องทางให้ลูกค้าติดต่อกลับ: **contact form ที่ส่งข้อความถึงอีเมลจริง** โดยไม่ต้องเขียน backend เอง — ใช้บริการ FormSubmit ซึ่ง agent เลือกให้ พร้อมขั้นตอนยืนยันเจ้าของอีเมลที่**มนุษย์ต้องทำเอง**

เป้าหมายของบทนี้: มีฟอร์มที่ใช้งานได้จริงบนหน้า contact และเข้าใจว่าทำไมการ activate อีเมลจึงหลีกเลี่ยงไม่ได้

## Prompt ที่ใช้

> อ่า ช่วยแก้ไขตัวเว็บไซต์ให้มี contact form ให้หน่อย เมื่อลูกค้ามีการกรอก contact form มาแล้ว ให้ส่งไปที่อีเมล sayhi@rawinsoft.com. ให้ค้นหาสถานที่ท่องเที่ยวทั่วใกล้ภูเก็ต แล้วก็ทำระบบ Searching ให้ด้วย. เมื่อเสร็จแล้วให้อัปเดตไซต์เดิม.

![ภาพ capture ของ prompt ขอ contact form และระบบค้นหา](/images/step5-contact-search-prompt.webp)

prompt นี้รวมสองงานในข้อความเดียว (contact form + ระบบค้นหา) — ทำได้ เพราะ agent แยกทำเป็น step ของมันเอง แต่ถ้าคุณเพิ่งเริ่ม แยกเป็นสอง prompt จะตรวจผลง่ายกว่า เราจะแยกพิจารณาเป็นสองบท: ฟอร์มในบทนี้ และระบบค้นหาใน [บท 04](04-search-system.md)

## ผลลัพธ์

agent ทำงาน 19 นาที 30 วินาที ระหว่างนั้น **หยุดถามกลับมาหาเราหนึ่งครั้ง** — นี่คือจุดสำคัญของบทนี้:

![ภาพ capture ของข้อความที่ agent ขอให้เปิดอีเมลและกด Activate Form ของ FormSubmit](/images/step5-contact-search-result1.webp)

FormSubmit ส่งอีเมลยืนยันไปที่ sayhi@rawinsoft.com แล้ว agent ขอให้เราเปิดอีเมลและกด **“Activate Form”** (ตรวจโฟลเดอร์สแปมด้วย) เพื่อเปิดรับข้อความจากฟอร์ม — เรากดยืนยันเสร็จแล้วตอบกลับ “ยืนยันอีเมลแล้ว” agent จึงทำต่อจนจบ และสรุปว่า:

- เพิ่มฟอร์มติดต่อไปยัง **sayhi@rawinsoft.com** พร้อมแจ้งข้อผิดพลาดและ**เก็บข้อความไว้ในเครื่องหากส่งไม่สำเร็จ**
- (ส่วนระบบค้นหา — ดูบท 04)

จากนั้น agent ทดสอบยืนยันว่าอีเมลมาถึงจริง โดยถามหาข้อความทดสอบหัวข้อ **“[เล ไปกัน] ทดสอบหลังยืนยัน — URL หลัก”** — สังเกตว่ามันไม่หลอกตัวเองว่า “น่าจะส่งได้” แต่ขอหลักฐานจากปลายทาง ครั้งนี้แก้ไฟล์ 18 ไฟล์ (+454 บรรทัด)

![หน้า contact ของเว็บ “เล ไปกัน” ที่มีฟอร์มกรอกชื่อ อีเมล และข้อความ](/images/site-contact.webp)

## ทำไมต้อง Activate Form และใครต้องกด

| ขั้นตอน | ใครทำ | ทำไม |
| --- | --- | --- |
| สร้างฟอร์มและเชื่อมปลายทางอีเมล | agent | เป็นโค้ดและการตั้งค่า |
| กด Activate Form ในอีเมลยืนยัน | **เจ้าของอีเมล** | พิสูจน์ว่าเป็นเจ้าของกล่องอีเมลจริง บริการจึงเปิดรับข้อความ — ความปลอดภัยที่ agent ยืนแทนเราไม่ได้ |
| ทดสอบส่งจริงและยืนยันว่าได้รับ | agent + เรา | ปิดจ๊อบด้วยหลักฐาน ไม่ใช่ความเชื่อ |

## ข้อควรระวังและบทเรียน

- **ฟอร์มที่ยังไม่ activate = ข้อความหายเงียบ** — ถ้าลืมกดยืนยัน ลูกค้ากรอกแล้วเหมือนสำเร็จ แต่เจ้าของเว็บไม่มีอีเมอร์ใด ๆ ถึงมือ ตรวจสแปมทุกครั้งที่เปิดฟอร์มใหม่
- **โดเมนใหม่ต้อง activate ใหม่** — หลัง deploy ขึ้นโดเมนจริงใน [บท 08](08-custom-domain.md) agent เตือนไว้เองว่า “ฟอร์มอีเมลบนโดเมนใหม่ยังไม่ได้ทดสอบส่งจริง” — เปิดฟอร์มจากโดเมนไหนก็ต้องยืนยันและทดสอบที่โดเมนนั้น
- **เตรียมรับว่า agent จะถามกลับ** — งานที่แตะต้อง identity จริง (อีเมล โดเมน บัญชี) มนุษย์ต้องลงมือเสมอ ให้ถือว่าเป็นด่านตรวจ ไม่ใช่สะดุด
- **การเก็บข้อความสำรองเมื่อส่งไม่สำเร็จเป็นแนวทางที่ดี** — ผู้ใช้ไม่ต้องพิมพ์ใหม่ และเราไม่พลาด lead

ต่อไป: [บท 04 — ระบบค้นหา 20 สถานที่ ไทย–อังกฤษ](04-search-system.md)