缓存应用内容

Cloud CDN 是 App Hosting 为您的 Web 应用提供支持的重要组成部分。对后端的每个请求都会先经过 Cloud CDN。已在 CDN 中缓存的内容会立即返回给用户，而无需访问运行 Web 应用服务器代码的 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. 响应具有含 max-age 或 s-maxage 指令的 Cache-Control 标头，或者具有带未来时间戳的 Expires 标头。

4. 响应具有 Age 标头或具有带显式 public 指令的 Cache-Control 标头。

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 或 Next-Url。

3. 响应具有含 no-store 或 private 指令的 Cache-Control 标头。

4. 该请求具有一个包含 no-store 指令的 Cache-Control 标头。

5. 请求具有 Authorization 标头，除非响应具有明确的缓存控制指令。

注意：Next.js 会自动将您在组件中读取的标头附加到 Vary；请谨慎使用 next/headers。

注意：受 Next.js 中间件影响的路由不会被缓存。

注意：Next.js 还会缓存服务器上的内容，默认情况下，这些内容会写入实例的内存中文件系统。请参阅在 Next.js 上配置服务器缓存。

使用缓存控制指令自定义行为

Next.js

Next.js 会根据多种因素隐式设置 cache-control 指令。不过，您可以通过在 next.config.js 文件中手动设置标头来替换这些标头。例如，为确保页面不会在 Cloud CDN 中缓存，请执行以下操作：

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

Angular

Angular SSR 默认不会设置明确的 cache-control 指令。您可以通过在服务器路由中指定 cache-control 标头来添加自己的标头。例如，如需允许 Cloud CDN 将所有网页缓存一小时，请使用以下代码：

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',
    }
  }
];

遵循的指令

Firebase App Hosting 的 Cloud CDN 实例遵循以下缓存控制指令：

指令	请求	回答
no-store	如果请求中存在此标头，则系统不会缓存响应。	包含 no-store 的响应不会被缓存。
no-cache	系统会忽略 no-cache 请求指令，以防止客户端可能发起或强制重新验证源站。	带有 no-cache 的响应会被缓存，但在传送之前必须先通过源站进行重新验证。
public	不适用	此指令并非可缓存性的必要条件，但对于应由代理缓存的内容，最好包含此指令。
private	不适用	Cloud CDN 不会缓存带有 private 指令的响应，即使该响应在其他方面被视为可缓存。客户端（例如浏览器）可能仍会缓存结果。使用 no-store 可防止对响应进行任何缓存。
max-age=SECONDS	系统会忽略 max-age 请求指令。系统会返回缓存的响应，就像请求中未包含此标头一样。	具有 max-age 指令的响应最多可缓存 SECONDS 秒。
s-maxage=SECONDS	不适用	包含 s-maxage 指令的响应最多会缓存到定义的 SECONDS。如果 max-age 和 s-maxage 都存在，则 Cloud CDN 会使用 s‑maxage。包含此指令的响应不会提供过时内容。s-max-age（两个连字符）不适用于缓存。
max-stale=SECONDS	max-stale 请求指令规定了客户端愿意接受的最大过时时间（以秒为单位）。Cloud CDN 会遵循此指令，并且仅在响应的过时时间小于 max-stale 指令时，才会返回过时的缓存响应。否则，它会在处理请求之前重新验证。	不适用
stale-while-revalidate=SECONDS	不适用	在异步重新验证期间，系统会向客户端提供具有 stale-while-revalidate 的响应，最长持续 SECONDS 秒。
must-revalidate	不适用	包含 must-revalidate 的响应在过期后会与源服务器重新验证。包含此指令的响应不会提供过时内容。
proxy-revalidate		包含 proxy-revalidate 的响应在过期后会与源服务器重新验证。包含此指令的响应不会提供过时内容。
no-transform	不适用	Cloud CDN 不会应用任何转换。

衡量缓存和未缓存的流量

在 Firebase 控制台的 App Hosting > 用量标签页中，“Cloud CDN - 出站带宽”图表会显示已传送的缓存和未缓存字节数，并为每次发布添加了标记。您可以使用此图表来衡量缓存优化工作的效果。

您还可以通过基于路由的监控查看 Web 应用中特定路由的缓存命中率。