แคชเนื้อหาแอป

Cloud CDN เป็นส่วนสำคัญของการรองรับเว็บแอปของ App Hosting ทุก คำขอที่ส่งไปยังแบ็กเอนด์จะผ่าน Cloud CDN ก่อน ระบบจะแสดงเนื้อหาที่แคชไว้ใน CDN ให้ผู้ใช้ทันที โดยข้ามการเดินทางไปยังบริการ Cloud Run ที่เรียกใช้โค้ดเซิร์ฟเวอร์ของเว็บแอป ดูข้อมูลเพิ่มเติมเกี่ยวกับ ประโยชน์ทั่วไปของ CDN ได้ที่ web.dev

แม้ว่าการกำหนดค่า Cloud CDN ขั้นพื้นฐานจะตั้งค่าโดย App Hosting และแก้ไขไม่ได้ แต่คุณก็สามารถทำสิ่งต่างๆ ได้มากมายเพื่อเพิ่มประสิทธิภาพการแคชเพื่อ เพิ่มความเร็วในการโหลดหน้าเว็บ ลดเนื้อหาที่ไม่ได้แคชซึ่งมีการเรียกเก็บเงิน และลด การเข้าชม Cloud Run

เนื้อหาที่แคชได้

Cloud CDN จะจัดเก็บการตอบกลับไว้ในแคชหากเงื่อนไขต่อไปนี้เป็นจริงทั้งหมด

1. คำขอเป็น GET

2. การตอบกลับมีรหัสสถานะเป็น 200, 203, 204, 206, 300, 301, 302, 307, 308, 404, 405, 410, 421, 451 หรือ 501

3. การตอบกลับมีส่วนหัว Cache-Control พร้อมคำสั่ง max-age หรือ s-maxage หรือส่วนหัว Expires พร้อมการประทับเวลาในอนาคต

4. การตอบกลับมีส่วนหัว Age หรือส่วนหัว Cache-Control พร้อมคำสั่ง public ที่ชัดเจน

5. การตอบกลับมีขนาดไม่เกิน 10 MiB

และเงื่อนไขต่อไปนี้ไม่มี ข้อใดเป็นจริง

1. การตอบกลับมีส่วนหัว Set-Cookie

2. การตอบกลับมีส่วนหัว Vary ที่มีค่าอื่นนอกเหนือจาก Accept, Accept-Encoding, Access-Control-Request-Headers, Access-Control-Request-Method, Origin, Sec-Fetch-Dest, Sec-Fetch-Mode, Sec-Fetch-Site, X-Goog-Allowed-Resources, X-Origin, RSC, Next-Router-State-Tree, Next-Router-Prefetch, หรือ Next-Router-Segment-Prefetch

3. การตอบกลับมีส่วนหัว Cache-Control พร้อมคำสั่ง no-store หรือ private

4. คำขอมีส่วนหัว Cache-Control พร้อมคำสั่ง no-store

5. คำขอมีส่วนหัว Authorization เว้นแต่การตอบกลับจะมีคำสั่งควบคุมแคชที่ชัดเจน

ปรับแต่งลักษณะการทำงานด้วยคำสั่งควบคุมแคช

  /** @type {import('next').NextConfig} */
  const nextConfig = {
      headers: async () => [{
          source: "/YOUR_PRIVATE_PAGE",
          headers: [{
              key: "Cache-Control",
              value: "private"
          }],
      }],
  };

import { RenderMode, ServerRoute } from '@angular/ssr';

export const serverRoutes: ServerRoute[] = [
  {
    path: '**',
    renderMode: RenderMode.Prerender,
    headers: {
      'Cache-Control': 'public, max-age=3600',
    }
  }
];

import { RenderMode, ServerRoute } from '@angular/ssr';

export const serverRoutes: ServerRoute[] = [
  // ... other routes
  {
    path: 'YOUR_PRIVATE_PAGE',
    renderMode: RenderMode.Server,
    headers: {
      'Cache-Control': 'private',
    }
  }
];

คำสั่งที่ระบบใช้

อินสแตนซ์ Cloud CDN ของ Firebase App Hosting's จะใช้คำสั่งควบคุมแคชต่อไปนี้

วัดการเข้าชมที่แคชและไม่ได้แคช

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

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