จัดการการทำงานของแคช

Firebase Hosting ใช้ CDN ทั่วโลกที่มีประสิทธิภาพเพื่อทำให้เว็บไซต์ของคุณทำงานได้เร็วที่สุดเท่าที่จะ เป็นไปได้

ระบบจะแคช เนื้อหาสแตติกที่ขอไว้ใน CDN โดยอัตโนมัติ หากคุณ นำเนื้อหาของเว็บไซต์ไปใช้งานใหม่ Firebase Hosting จะล้างเนื้อหาที่ แคชทั้งหมดใน CDN โดยอัตโนมัติจนกว่าจะมีการขอครั้งถัดไป

อย่างไรก็ตาม เนื่องจากบริการ Cloud Functions และ Cloud Run สร้างเนื้อหาแบบไดนามิก เนื้อหาสำหรับ URL ที่กำหนดจึงอาจแตกต่างกันไปตามปัจจัยต่างๆ เช่น ข้อมูลที่ผู้ใช้ป้อนหรือข้อมูลประจำตัวของผู้ใช้ ระบบจึงไม่ได้แคชคำขอที่ โค้ดแบ็กเอนด์จัดการใน CDN โดยค่าเริ่มต้น

แต่คุณสามารถกำหนดค่าลักษณะการทำงานของการแคชสำหรับเนื้อหาแบบไดนามิก ได้ ตัวอย่างเช่น หากฟังก์ชันสร้างเนื้อหาใหม่เป็นระยะๆ คุณสามารถเพิ่มความเร็วของแอปได้โดยการแคชเนื้อหาที่สร้างขึ้นเป็นระยะเวลาสั้นๆ อย่างน้อย

ในทำนองเดียวกัน คุณสามารถกำหนดค่าลักษณะการทำงานของการแคชเพื่อลดค่าใช้จ่ายในการดำเนินการฟังก์ชันได้ เนื่องจากระบบจะแสดงเนื้อหาจาก CDN แทนที่จะแสดงจากฟังก์ชันที่ทริกเกอร์ อ่านเพิ่มเติมเกี่ยวกับการเพิ่มประสิทธิภาพการดำเนินการฟังก์ชันและบริการ ได้ในเอกสารประกอบของ Cloud Functions และ Cloud Run

ข้อยกเว้นคือคำขอที่แสดงข้อผิดพลาด 404 CDN จะแคชการตอบกลับ 404 ของบริการสำหรับ URL ที่ไม่มีอยู่เป็นเวลา 10 นาที เพื่อให้คำขอ URL นั้นในภายหลังแสดงจาก CDN หากคุณเปลี่ยนบริการเพื่อให้เนื้อหาปรากฏใน URL นี้ CDN จะแสดงการตอบกลับ 404 ที่แคชไว้ต่อไปเป็นเวลา 10 นาที (อย่างมาก) แล้วจึงแสดงเนื้อหาจาก URL นั้นตามปกติ

หากการตอบกลับ 404 มีส่วนหัวการแคชที่ Cloud Functions หรือ Cloud Run บริการตั้งค่าไว้แล้ว ส่วนหัวเหล่านั้นจะลบล้างค่าเริ่มต้น 10 นาทีและกำหนดลักษณะการทำงานของการแคชของ CDN อย่างเต็มที่

ดูข้อมูลเพิ่มเติมเกี่ยวกับลักษณะการทำงานของการแคชได้ในเอกสารประกอบสำหรับนักพัฒนาเว็บของ Google

ตั้งค่า Cache-Control

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

res.set('Cache-Control', 'public, max-age=300, s-maxage=600');

ในส่วนหัวตัวอย่างนี้ Directive จะทำ 3 สิ่งต่อไปนี้

• public \- ทำเครื่องหมายการตอบกลับเป็น public ซึ่งหมายความว่าทั้งเบราว์เซอร์ และแคชระดับกลาง (รวมถึง CDN สำหรับ Firebase Hosting) สามารถ แคชเนื้อหาได้

  หมายเหตุ: โดยค่าเริ่มต้น Firebase Hosting จะตั้งค่า Cache-Control เป็น private สำหรับ เนื้อหาแบบไดนามิก ซึ่งหมายความว่าหากคุณไม่ได้ตั้งค่า Cache-Control เป็น public อย่างชัดเจน เฉพาะเบราว์เซอร์ของผู้ใช้ที่ส่งคำขอเท่านั้นที่จะแคชเนื้อหาได้

• max-age \- ตั้งค่าจำนวนวินาทีที่การตอบกลับจะเก่าได้ก่อนที่จะต้องตรวจสอบซ้ำกับเซิร์ฟเวอร์ต้นทาง การตั้งค่านี้มีผลกับเบราว์เซอร์ และหากไม่มีส่วนหัว s-maxage ก็จะมีผลกับแคชอื่นๆ ทั้งหมด (รวมถึง CDN) ด้วย

• s-maxage \- ลบล้าง Directive max-age สำหรับแคชที่แชร์ (เช่น CDN) เมื่อ CDN พบการตอบกลับที่เก่ากว่า s-maxage วินาที CDN จะตรวจสอบซ้ำกับเซิร์ฟเวอร์ต้นทาง ในส่วนหัวตัวอย่าง เบราว์เซอร์จะแคชการตอบกลับได้ 5 นาที แต่ CDN และแคชระดับกลางอื่นๆ จะแคชได้ 10 นาที

สำหรับ max-age และ s-maxage ให้ตั้งค่าเป็นระยะเวลาที่นานที่สุดที่คุณยอมรับได้ว่าผู้ใช้จะได้รับเนื้อหาที่ล้าสมัย หากหน้าเว็บมีการเปลี่ยนแปลงทุกๆ 2-3 วินาที ให้ใช้ค่าเวลาที่น้อย แต่เนื้อหาประเภทอื่นๆ สามารถแคชได้อย่างปลอดภัยเป็นชั่วโมง วัน หรือแม้แต่เดือน

หากต้องการป้องกันการแคชโดยสมบูรณ์ (เช่น เพื่อแสดงเนื้อหาสแตติกเวอร์ชันล่าสุดเสมอ) คุณสามารถกำหนดค่านี้ใน firebase.json โดยใช้การตั้งค่า headers ดังนี้

"hosting": {
  // ...

  // Disables caching for the /posts route
  "headers": [ {
    // Change source to match your dynamically-rendered routes
    "source": "/posts/**",
    "headers": [ {
      "key": "Cache-Control",
      "value": "no-cache, no-store"
    } ]
  } ]
}

ดูข้อมูลเพิ่มเติมเกี่ยวกับส่วนหัว Cache-Control ได้ใน Mozilla Developer Network และใน เอกสารประกอบสำหรับนักพัฒนาเว็บของ Google

ระบบจะแสดงเนื้อหาที่แคชไว้เมื่อใด

เบราว์เซอร์และ CDN จะแคชเนื้อหาของคุณโดยอิงตามข้อมูลต่อไปนี้

• ชื่อโฮสต์
• เส้นทาง
• สตริงการค้นหา
• เนื้อหาของส่วนหัวคำขอที่ระบุไว้ในส่วนหัว Vary

ส่วนหัว Vary

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

Firebase Hosting จะตั้งค่าส่วนหัว Vary ที่เหมาะสมในการตอบกลับของคุณโดยอัตโนมัติสำหรับสถานการณ์ทั่วไป ส่วนใหญ่แล้วคุณไม่จำเป็นต้องกังวล เกี่ยวกับส่วนหัว Vary header. แต่ในกรณีการใช้งานขั้นสูงบางกรณี คุณอาจมีส่วนหัวอื่นๆ ที่ต้องส่งผลต่อแคช ในกรณีดังกล่าว คุณสามารถตั้งค่าส่วนหัว Vary ในการตอบกลับได้ เช่น

res.set('Vary', 'Accept-Encoding, X-My-Custom-Header');

ในกรณีนี้ ค่าของส่วนหัว Vary คือ

vary: X-My-Custom-Header, x-fh-requested-host, accept-encoding, cookie, authorization

การตั้งค่าเหล่านี้จะทำให้คำขอ 2 รายการที่เหมือนกันแต่มีส่วนหัว X-My-Custom-Header ต่างกันได้รับการแคชแยกกัน โปรดทราบว่า Hosting จะเพิ่ม Cookie และ Authorization ลงในส่วนหัว Vary โดยค่าเริ่มต้นเมื่อมีการส่งคำขอเนื้อหาแบบไดนามิก ซึ่งจะช่วยให้มั่นใจได้ว่าส่วนหัวการให้สิทธิ์ของเซสชันหรือคุกกี้ที่คุณใช้จะเป็นส่วนหนึ่งของคีย์แคช ซึ่งจะป้องกันไม่ให้เนื้อหารั่วไหลโดยไม่ตั้งใจ

นอกจากนี้ โปรดทราบว่า

• ระบบจะแคชได้เฉพาะคำขอ GET และ HEAD เท่านั้น คำขอ HTTPS ที่ใช้วิธีอื่นๆ จะไม่ได้รับการแคช

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

การใช้คุกกี้

เมื่อใช้ Firebase Hosting ร่วมกับ Cloud Functions หรือ Cloud Run โดยทั่วไปแล้วระบบจะนำคุกกี้ออกจากคำขอขาเข้า ซึ่งจำเป็นเพื่อให้ CDN มีลักษณะการทำงานของการแคชที่มีประสิทธิภาพ เฉพาะคุกกี้ __session ที่มีชื่อพิเศษเท่านั้นที่จะส่งผ่านไปยังการดำเนินการของแอปได้

เมื่อมีอยู่ ระบบจะทำให้คุกกี้ __session เป็นส่วนหนึ่งของคีย์แคชโดยอัตโนมัติ ซึ่งหมายความว่าผู้ใช้ 2 คนที่มีคุกกี้ต่างกันจะไม่ได้รับการตอบกลับที่แคชไว้ของอีกคน ให้ใช้คุกกี้ __session ก็ต่อเมื่อแอปแสดงเนื้อหาที่แตกต่างกันไปตามการให้สิทธิ์ของผู้ใช้