วิธีสร้างแบ็คเอนด์แบบไร้เซิร์ฟเวอร์เพื่อยอมรับข้อมูลแบบฟอร์มขาเข้า (หรือข้อมูลอื่นจากคำขอ API) และส่งอีเมลที่มีข้อมูลนั้น

S3+CloudFront เป็นโซลูชันที่ง่ายและต้นทุนต่ำในการโฮสต์เว็บไซต์แบบคงที่ อย่างไรก็ตาม จะเกิดอะไรขึ้นเมื่อคุณต้องการแบบฟอร์ม HTML? เราจะพูดถึงการใช้แบ็คเอนด์แบบไร้เซิร์ฟเวอร์อย่างง่ายเพื่อจุดประสงค์นี้!

การแนะนำ

“AWS S3” + “Cloudfront” เป็นตัวเลือกราคาประหยัดและปรับขนาดได้สำหรับการโฮสต์เว็บไซต์แบบคงที่ เช่น “หน้า Landing Page สำหรับสตาร์ทอัพ” หรือหน้าสมัครรับจดหมายข่าว อย่างไรก็ตาม คุณจะใช้แบบฟอร์มโดยไม่มีเซิร์ฟเวอร์ได้อย่างไร

ในบทความนี้ เราจะพูดถึงแบ็คเอนด์แบบไร้เซิร์ฟเวอร์สำหรับแบบฟอร์มโดยใช้ Lambda และ API Gateway ของ AWS เพื่อทริกเกอร์การส่งอีเมลพร้อมข้อมูลที่กรอกจากแบบฟอร์มไปยังอีเมลที่กำหนดไว้ล่วงหน้าโดยใช้ AWS SES

ข้อกำหนดเบื้องต้น

ก่อนที่เราจะเจาะลึกโค้ดของ Lambda เราจำเป็นต้องตั้งค่าสภาพแวดล้อมการพัฒนาและบัญชี AWS ของเรา รวมถึงประเด็นด้านล่าง:

  1. เครื่องมือพัฒนาภายใน AWS Serverless Application Model (SAM) ได้รับการติดตั้งตามคำแนะนำ ที่นี่
  2. AWS SES ได้รับการกำหนดค่าในโหมดการใช้งานจริง (ไม่ใช่แซนด์บ็อกซ์) และโดเมนได้รับการยืนยันตามคำแนะนำ ที่นี่
  3. มีเว็บไซต์ที่มีรูปแบบ HTML ที่สามารถกำหนดค่าให้ส่งข้อมูลไปยังจุดสิ้นสุดของเกตเวย์ API ที่จะสร้างขึ้นในภายหลังในบทความนี้

การนำไปปฏิบัติ

เราจะใช้ SAM เพื่อปรับใช้ Lambda และทรัพยากรที่ต้องพึ่งพา หากต้องการทราบข้อมูลเบื้องต้นเพิ่มเติมเกี่ยวกับ SAM โปรดดูบทความด้านล่างนี้



เริ่มจากโครงสร้างโฟลเดอร์กันก่อน เราจะมีไดเรกทอรีสำหรับไฟล์ต้นฉบับของแอปพลิเคชัน หนึ่งรายการสำหรับสคริปต์ที่สามารถใช้ในการปรับใช้แอปพลิเคชัน และไฟล์ระดับบนสุด เช่น template.yaml ที่ SAM ใช้

my-serverless-form/
├── cmd/
│   └── deploy.sh
├── src/
|   ├── package.json
│   └── index.js
├── .gitignore 
└── template.yaml

template.yaml จะมีลักษณะเช่นนี้:

เทมเพลตด้านบนกำหนดทรัพยากร 2 รายการ:

  1. FormSubmissionFunction: Lambda ที่เมื่อถูกกระตุ้นจะส่งอีเมล
  2. FormSubmissionApi: API Gateway ที่จะรับคำขอสาธารณะจากอินเทอร์เน็ตและทริกเกอร์ Lambda

รหัสแลมบ์ดาจะถูกระบุในไฟล์ index.js ดังที่แสดงด้านล่าง:

ในนั้น เราจะส่งอีเมลโดยใช้ "SES" ซึ่งมีข้อมูลจาก eventObject ซึ่งจะมีเนื้อหาและส่วนหัวของคำขอที่ใช้ในการทริกเกอร์ Lambda คุณสามารถจัดรูปแบบเนื้อหาของอีเมลได้ตามต้องการ

หากต้องการแยกวิเคราะห์ข้อมูลฟอร์มใน Lambda ฉันขอแนะนำให้ใช้ไลบรารีด้านล่าง:



หากต้องการปรับใช้ Lambda คุณสามารถเรียกใช้ไฟล์ script.sh (แสดงด้านล่าง) และปฏิบัติตามคำแนะนำบนหน้าจอ:

บทสรุป

เราได้อธิบายวิธีสร้างแบ็กเอนด์แบบไร้เซิร์ฟเวอร์ที่สามารถใช้เพื่อยอมรับข้อมูลแบบฟอร์มขาเข้า (หรือข้อมูลอื่นจากคำขอ API) และส่งอีเมลที่มีข้อมูลดังกล่าว

อย่างไรก็ตาม ก่อนที่จะปรับใช้สิ่งนี้กับการใช้งานจริง อาจเป็นการฉลาดที่จะใช้ reCaptcha (หรือที่คล้ายกัน) เพื่อหลีกเลี่ยงไม่ให้บอทค้นพบตำแหน่งข้อมูลของคุณและส่งข้อมูลเท็จ (คุณไม่ต้องการถูกเรียกเก็บเงินสำหรับเวลาดำเนินการ Lambda สำหรับการส่งอีเมลจาก บอท)

หวังว่าสิ่งนี้จะเป็นประโยชน์!

หากคุณมีคำถามใดๆ หรือเพียงต้องการพูดคุยเกี่ยวกับสตาร์ทอัพ การเป็นผู้ประกอบการ การทำสัญญา หรือวิศวกรรม เพียงส่งอีเมลถึงฉันที่ paulo@avantsoft.com.br