วิธีเปลี่ยนการตั้งค่า Cache สำหรับแต่ละนามสกุลไฟล์ใน CloudFront

การตั้งค่า Cache policy ใน CloudFront สามารถตั้งค่าให้เหมาะสมกับการใช้งานได้ เช่นถ้าเป็นไฟล์เว็บไซต์แบบ Dynamic ก็จะตั้งค่าเป็น CachingDisabled แต่ถ้าเป็นไฟล์เว็บไซต์ที่ไม่มีการเปลี่ยนข้อมูลการแสดงผลจะใช้เป็น CachingOptimized ซึ่งการตั้งค่า Cache policy ที่มีความเหมาะสมจะช่วยให้เว็บไซต์มีประสิทธิภาพมากขึ้น

Amazon CloudFront

Amazon CloudFront เป็น Web Cache Server ใช้แคชข้อมูลในการแสดงผล ทำให้สามารถเพิ่มความเร็วของการแสดงผลด้วยการแสดงเนื้อหาที่แคชบันทึกไว้จนกว่าแคชจะหมดอายุ ซึ่ง CloudFront จะบันทึกข้อมูลลงแคชไฟล์ โดยแคชไฟล์จะถูกเก็บอยู่ใน Edge location ต่างๆ ทั่วโลก เมื่อมีการเรียกใช้งานเว็บไซต์ ระบบจะดึงแคชไฟล์จาก Edge location ที่ใกล้ที่สุดมาแสดงผล

โดยมีการแสดงผลข้อมูลจากเซิร์ฟเวอร์ที่ใกล้กับผู้ใช้งานมากที่สุดเพื่อความรวดเร็วไม่ว่าเราจะอยู่ส่วนใดของโลกก็ตาม
EC2-CloudFront-Global

สิ่งที่ต้องมี

เมื่อมี Web Server ใน EC2 แล้ว ให้ทำการเชื่อมต่อกับ CloudFront ตามลิงก์ด้านล่างนี้

เมื่อทำตามขั้นตอนข้างต้นทั้งหมดนี้เรียบร้อยแล้ว สามารถเริ่มทำการเปลี่ยนการตั้งค่า Cache ในหัวข้อถัดไปได้เลย

วิธีเปลี่ยนการตั้งค่า Cache

เราจะมาเปลี่ยนการตั้งค่า Cache policy ดังนี้
CachingOptimized = เปิดการใช้งาน Cache
CachingDisabled = ปิดการใช้งาน Cache

ตรวจสอบสถานะ x-cache

อันดับแรกให้เปิดหน้าเว็บเบราว์เซอร์โดยใช้ Domain name ของ CloudFront เช่นd3**********ig.cloudfront.netจากนั้นกดปุ่มF12

ถ้าต้องการให้มาอยู่ด้านล่าง ให้ทำตามนี้
» เลือก
» เลือกแนวล่าง
on-off-cache-8

» เลือกNetwork
» Reload
» เลือกไฟล์รูปภาพ png ของเราเอง
» เลือกHeaders
» เลื่อนลงมาด้านล่าง มาที่หัวข้อResponse Headersจะเห็นว่าx-cacheมีสถานะเป็นMiss from cloudfront

http://d3**********ig.cloudfront.net/

on-off-cache-1-url-1

เปลี่ยนการตั้งค่า Cache

ขั้นตอนนี้เราจะมาทำการเปิดการใช้งาน Cache ใน Behaviors ของ CloudFront

ไปที่ช่องค้นหา พิมพ์คำว่า🔍︎ CloudFront» เลือกCloudFront
S-CF-1

คลิกDistributionsของเรา S-CF-2

เลือกBehaviors» คลิกCreate behavior
on-off-cache-2

» Path pattern:/images/*(ทุกไฟล์ที่อยู่ในโฟลเดอร์ images จะเป็นCachingOptimizedทั้งหมด)
» Origin and origin groups: เลือก Origin or origin group ของเราเอง
on-off-cache-3

ในส่วนนี้เราจะใช้ Cache policy เป็นCachingOptimizedหมายถึงเปิดการใช้งาน Cache
on-off-cache-4

คลิกCreate behavior
on-off-cache-5

จะได้ Path pattern ที่เราสร้างขึ้น

Path pattern
/images/*     ไฟล์ทั้งหมดในโฟลเดอร์ images จะเป็น CachingOptimized
*.ico     ไฟล์ .ico ทั้งหมดในโฟลเดอร์หลัก จะเป็น CachingOptimized
Default (*)     ไฟล์ทั้งหมดในโฟลเดอร์หลัก ที่ไม่ได้ทำการตั้งค่า Path pattern ไว้ จะเป็น CachingDisabled ตามที่ได้สร้าง CloudFront ไว้ตอนแรก

on-off-cache-6

» Reload อีกครั้ง
» เลือกไฟล์รูปภาพ png จะเห็นว่าx-cacheจะเป็นHit from cloudfront

<pre class="brush; gutter: false;">http://d3**********ig.cloudfront.net/

on-off-cache-7-url-1
เพียงเท่านี้ก็สามารถเปลี่ยนการตั้งค่า Cache ได้ตามต้องการแล้ว

สรุป

การเปลี่ยน Cache policy จำเป็นต้องเลือกการใช้งานให้เหมาะสม เช่น ถ้าเป็นไฟล์ .php ที่มีการแสดงผลแบบเปลี่ยนแปลงข้อมูลตลอดเวลา หรือที่เรียกว่า Dynamic เราจะใช้ Cache policy เป็นCachingDisabledซึ่งการแสดงผลจะเร็วหรือช้าขึ้นอยู่กับการใช้งานจากสถานที่ต่างๆ เพราะการแสดงผลแบบ Dynamic จะมีการรับส่งข้อมูลไป/กลับอยู่ตลอดเวลา จึงทำให้การแสดงผลไม่เร็วเท่าการใช้ CachingOptimized

ส่วนไฟล์ที่เป็น image หรืออื่นๆ เช่น .png .css .js จะเป็นไฟล์ที่ไม่มีการเปลี่ยนแปลงข้อมูลในการแสดงผล เราจะใช้ Cache policy เป็นCachingOptimizedเพื่อให้แคชไฟล์ถูกเก็บไว้ใน Edge location ต่างๆ ทั่วโลก แล้วเวลาเรียกใช้งานเว็บไซต์ ระบบจะดึงแคชไฟล์จาก Edge location ที่ใกล้ที่สุดมาแสดงผล จึงทำให้ระบบมีความเร็วในการแสดงผลมากขึ้น

บทความที่เกี่ยวข้อง

ดูรายละเอียดเพิ่มเติมได้ที่นี่ สอบถามเพิ่มเติมเกี่ยวกับ AWS คลิกที่นี่