หน้าแรก>ซอร์สโค้ด ASP>หมวดหมู่อื่นๆ
ดาวน์โหลด

ข้อความแสดงแทน

โฮสต์ไซต์แบบคงที่ด้วย AWS และ Serverless Framework

แอปพลิเคชันนี้สร้างทรัพยากร AWS ที่หลากหลายเพื่อโฮสต์แอปพลิเคชันหน้าเดียว แอปพลิเคชันยังมีแบบฟอร์มติดต่อเพื่อบันทึกข้อมูลการติดต่อลงในฐานข้อมูลและส่งอีเมลไปยังผู้เขียนแอปพลิเคชันด้วย

บริการของ AWS ที่ใช้ในแอปพลิเคชันนี้

  • S3 - สำหรับการโฮสต์
  • CloudFront - สำหรับ CDN
  • Route53 - สำหรับ DNS
  • ตัวจัดการใบรับรอง - สำหรับใบรับรอง HTTPS
  • API เกตเวย์ - สำหรับ API
  • Lambda - สำหรับการบันทึกข้อมูลแบบฟอร์มการติดต่อ
  • DynamoDB - สำหรับฐานข้อมูล
  • SNS - สำหรับการส่งอีเมลถึงผู้เขียนเมื่อมีคนส่งข้อความติดต่อ

การกำหนดค่าชื่อโดเมน Route53

สำหรับการสาธิตนี้ ฉันกำลังใช้ชื่อโดเมน Namecheap ที่กำหนดเส้นทางไปยัง Amazon Route53 เพื่อให้ฉันสามารถใช้การรับรอง HTTPS ได้โดยไม่ต้องกังวลเป็นพิเศษ คุณสามารถไปที่ลิงก์นี้เพื่อกำหนดค่าการเปลี่ยนเส้นทาง Namecheap ไปยัง Route53 และ ACM สำหรับใบรับรอง SSL

หากต้องการใช้ใบรับรอง ACM กับ Amazon CloudFront คุณต้องขอหรือนำเข้าใบรับรองในภูมิภาคสหรัฐอเมริกาฝั่งตะวันออก (เวอร์จิเนียเหนือ)

หมายเหตุ: โปรดตรวจสอบให้แน่ใจว่าชื่อบัคเก็ต S3 ของคุณตรงกับชื่อโดเมนของคุณ ตัวอย่างเช่น ชื่อโดเมนของฉันเป็น newarc.io ดังนั้นฉันจึงกำหนดค่าชื่อบัคเก็ตของฉันให้เป็น newarc.io

https://benjamincongdon.me/blog/2017/06/13/How-to-Deploy-a-Secure-Static-Site-to-AWS-with-S3-and-CloudFront/

การปรับใช้

ก่อนที่คุณจะปรับใช้ ให้สร้าง config.dev.json จากไฟล์ sample.config.json และตั้งค่า 

 {
    "BUCKET_NAME": "S3 bucket name. For example, mysite.com",
    "TABLE_NAME": "DynamoDB table name",
    "CONTACT_RECEIVED_TOPIC": "contact-received-email",
    "FORWARD_EMAIL": "Email where you want to receive contact message",
    "ACM_CERT_ARN": "arn:aws:acm:us-east-1:<AWS ACCOUNT>:certificate/<CERTIFICATION ID>",
    "HOSTED_ZONE_ID": "Route53 Hosted Zone ID" 
}

เรียกใช้คำสั่ง sls deploy เพื่อปรับใช้การเปลี่ยนแปลงกับ AWS

เผยแพร่เนื้อหาไซต์

เพื่อผลักดันการเปลี่ยนแปลงเฉพาะของไซต์ (Html, CSS, JS ฯลฯ ) 

 aws s3 sync app/ s3://<bucket name>

แคช CloudFront ใช้งานไม่ได้

หลังจากใช้บริการแล้ว หากคุณเพียงผลักดันการเปลี่ยนแปลงไปยังไซต์ของคุณ การกระจาย CloudFront จะใช้เวลาในการอัปเดตเนื้อหาที่แคชไว้ หากต้องการอัปเดต CloudFront ทันที คุณจะต้องทำให้แคช invalidate

ไปที่คอนโซล CloudFront และคัดลอกรหัสการแจกจ่ายที่สร้างผ่านบริการนี้ และเรียกใช้คำสั่งต่อไปนี้ โปรดทราบว่าคำสั่งต่อไปนี้จะล้างแคชทั้งหมด คุณสามารถล้างไฟล์ที่เลือกได้โดยใช้ --paths เช่นกัน 

 aws cloudfront create-invalidation --distribution-id <ID> --paths /*

สำหรับรายละเอียดเพิ่มเติม ตรวจสอบเอกสารที่นี่ - https://docs.aws.amazon.com/AmazonCloudFront/latest/DeveloperGuide/Invalidation.html

การสมัครรับอีเมล SNS

เมื่อมีคนกรอกแบบฟอร์มการติดต่อใน UI API จะบันทึกข้อมูลลงใน DynamoDB และยังเผยแพร่ข้อความในหัวข้อ SNS ที่กำหนดค่าไว้ด้วย หัวข้อ SNS ยังมีการสมัครรับอีเมล ซึ่งคุณสามารถใส่อีเมลในตำแหน่งที่คุณต้องการรับรายละเอียดข้อความได้

หลังจากที่คุณใช้บริการแล้ว คุณจะได้รับอีเมลยืนยันจาก AWS เพื่อเปิดใช้งานการสมัครของคุณ โปรดปฏิบัติตามคำแนะนำในอีเมล

สำหรับรายละเอียดเพิ่มเติม ตรวจสอบเอกสารที่นี่ - https://docs.aws.amazon.com/sns/latest/dg/sns-email-notifications.html

ทำความสะอาด

ล้างเนื้อหาที่ฝากข้อมูลของไซต์ก่อน 

 aws s3 rm s3://<bucket name> --recursive

ลบสแต็กแอปพลิเคชัน 

 sls remove --profile <your profile> --aws-region <region>

ใบอนุญาต

ใบอนุญาตเอ็มไอที

ลิขสิทธิ์ (c) 2021 Dhaval Nagar

ขยาย
ข้อมูลเพิ่มเติม
แอปที่เกี่ยวข้อง
แนะนำสำหรับคุณ
ข้อมูลที่เกี่ยวข้อง ทั้งหมด