maximize Cloudflare edge caching

This commit is contained in:
2569718930@qq.com
2026-06-10 19:11:58 +08:00
parent 081bf9cc05
commit 1494db8e09
18 changed files with 421 additions and 42 deletions
+10 -4
View File
@@ -1,6 +1,9 @@
import { NextRequest, NextResponse } from "next/server";
import { proxyBackendJsonGet } from "@/lib/api-proxy";
import { buildCityDetailProxyCachePolicy } from "@/lib/proxy-cache-policy";
import {
buildCityDetailProxyCachePolicy,
NO_STORE_CACHE_CONTROL,
} from "@/lib/proxy-cache-policy";
import {
createProxyTimer,
finishProxyTimedResponse,
@@ -79,7 +82,7 @@ export async function GET(req: NextRequest) {
const forceRefresh = req.nextUrl.searchParams.get("force_refresh") ?? "false";
const requestedCities = parseRequestedCities(req);
const cachePolicy = buildCityDetailProxyCachePolicy(forceRefresh, 15);
const cachePolicy = buildCityDetailProxyCachePolicy(forceRefresh);
const searchParams = new URLSearchParams({
cities: req.nextUrl.searchParams.get("cities") || "",
force_refresh: forceRefresh,
@@ -100,7 +103,7 @@ export async function GET(req: NextRequest) {
data &&
typeof data === "object" &&
(data as { partial?: unknown }).partial === true
? "no-store, max-age=0"
? NO_STORE_CACHE_CONTROL
: cachePolicy.responseCacheControl,
fetchCache: "no-store",
publicMessage: "Failed to fetch city detail batch",
@@ -108,7 +111,10 @@ export async function GET(req: NextRequest) {
signal: controller.signal,
timeoutResponse: () =>
NextResponse.json(buildCityDetailBatchTimeoutPayload(requestedCities), {
headers: { "Cache-Control": "no-store, max-age=0" },
headers: {
"Cache-Control": NO_STORE_CACHE_CONTROL,
"Cloudflare-CDN-Cache-Control": NO_STORE_CACHE_CONTROL,
},
status: 200,
}),
timeoutPublicMessage: "City detail batch request timed out",
+6 -3
View File
@@ -1,12 +1,15 @@
import { NextRequest } from "next/server";
import { proxyBackendJsonGet } from "@/lib/api-proxy";
import { buildCachedJsonResponse } from "@/lib/http-cache";
import {
buildCityListCacheControl,
buildStaticCityListFallbackCacheControl,
} from "@/lib/proxy-cache-policy";
import { STATIC_CITY_LIST } from "@/lib/static-cities";
const API_BASE = process.env.POLYWEATHER_API_BASE_URL;
const CITIES_CACHE_CONTROL = "public, max-age=0, s-maxage=60, stale-while-revalidate=300";
const STATIC_CITIES_CACHE_CONTROL =
"public, max-age=0, s-maxage=300, stale-while-revalidate=3600";
const CITIES_CACHE_CONTROL = buildCityListCacheControl();
const STATIC_CITIES_CACHE_CONTROL = buildStaticCityListFallbackCacheControl();
const CITIES_BACKEND_TIMEOUT_MS = Number(
process.env.POLYWEATHER_CITIES_BACKEND_TIMEOUT_MS || 1000,
);
+2 -2
View File
@@ -49,7 +49,7 @@ export async function GET(
const { name } = await timer.measure("route_params", () => context.params);
const forceRefresh = req.nextUrl.searchParams.get("force_refresh") ?? "false";
const cachePolicy = buildCityDetailProxyCachePolicy(forceRefresh, 15);
const cachePolicy = buildCityDetailProxyCachePolicy(forceRefresh);
const depth = req.nextUrl.searchParams.get("depth");
const marketSlug = req.nextUrl.searchParams.get("market_slug");
const targetDate = req.nextUrl.searchParams.get("target_date");
@@ -82,7 +82,7 @@ export async function GET(
headers: auth.headers,
...(cachePolicy.fetchMode === "no-store"
? { cache: "no-store" as const }
: { next: { revalidate: cachePolicy.revalidateSeconds ?? 15 } }),
: { next: { revalidate: cachePolicy.revalidateSeconds ?? 60 } }),
}),
);
const backendServerTiming = res.headers.get("server-timing") || "";
+4 -4
View File
@@ -139,7 +139,7 @@ export async function GET(
const { name } = await context.params;
const forceRefresh = req.nextUrl.searchParams.get("force_refresh") ?? "false";
const depth = req.nextUrl.searchParams.get("depth") ?? "panel";
const cachePolicy = buildCityDetailProxyCachePolicy(forceRefresh, 15);
const cachePolicy = buildCityDetailProxyCachePolicy(forceRefresh);
const url = `${API_BASE}/api/city/${encodeURIComponent(name)}?force_refresh=${forceRefresh}&depth=${encodeURIComponent(depth)}`;
try {
@@ -150,7 +150,7 @@ export async function GET(
headers: auth.headers,
...(cachePolicy.fetchMode === "no-store"
? { cache: "no-store" as const }
: { next: { revalidate: cachePolicy.revalidateSeconds ?? 15 } }),
: { next: { revalidate: cachePolicy.revalidateSeconds ?? 60 } }),
});
if (!res.ok) {
const raw = await res.text();
@@ -159,7 +159,7 @@ export async function GET(
headers: auth.headers,
...(cachePolicy.fetchMode === "no-store"
? { cache: "no-store" as const }
: { next: { revalidate: 10 } }),
: { next: { revalidate: cachePolicy.revalidateSeconds ?? 60 } }),
});
if (summaryRes.ok) {
const summaryData = await summaryRes.json();
@@ -168,7 +168,7 @@ export async function GET(
buildFallbackCityDetail(name, depth, summaryData),
cachePolicy.fetchMode === "no-store"
? cachePolicy.responseCacheControl
: "public, max-age=0, s-maxage=10, stale-while-revalidate=30",
: cachePolicy.responseCacheControl,
);
response.headers.set("X-PolyWeather-Fallback", "summary");
return applyAuthResponseCookies(response, auth.response);
@@ -2,10 +2,13 @@ import assert from "node:assert/strict";
import fs from "node:fs";
import path from "node:path";
import {
buildCityListCacheControl,
buildScanTerminalResponseCacheControl,
buildCityDetailProxyCachePolicy,
buildForceRefreshProxyCachePolicy,
buildPublicEdgeCacheControl,
isForceRefreshValue,
NO_STORE_CACHE_CONTROL,
} from "@/lib/proxy-cache-policy";
export function runTests() {
@@ -18,11 +21,21 @@ export function runTests() {
assert.match(forced.responseCacheControl, /no-store/);
assert.equal(forced.revalidateSeconds, undefined);
const cached = buildCityDetailProxyCachePolicy("false", 15);
const cached = buildCityDetailProxyCachePolicy("false");
assert.equal(cached.fetchMode, "revalidate");
assert.equal(cached.revalidateSeconds, 15);
assert.match(cached.responseCacheControl, /max-age=15/);
assert.match(cached.responseCacheControl, /s-maxage=15/);
assert.equal(cached.revalidateSeconds, 60);
assert.match(cached.responseCacheControl, /max-age=30/);
assert.match(cached.responseCacheControl, /s-maxage=60/);
assert.match(cached.responseCacheControl, /stale-while-revalidate=300/);
assert.equal(
buildPublicEdgeCacheControl(60, 300),
"public, max-age=0, s-maxage=60, stale-while-revalidate=300",
);
assert.equal(
buildCityListCacheControl(),
"public, max-age=0, s-maxage=300, stale-while-revalidate=3600",
);
const scanForced = buildForceRefreshProxyCachePolicy("true", 10);
assert.equal(scanForced.fetchMode, "no-store");
@@ -34,15 +47,15 @@ export function runTests() {
);
assert.equal(
buildScanTerminalResponseCacheControl({ status: "failed", stale: false }, normalScanCache),
"no-store, max-age=0",
NO_STORE_CACHE_CONTROL,
);
assert.equal(
buildScanTerminalResponseCacheControl({ status: "partial", stale: false }, normalScanCache),
"no-store, max-age=0",
NO_STORE_CACHE_CONTROL,
);
assert.equal(
buildScanTerminalResponseCacheControl({ status: "ready", stale: true }, normalScanCache),
"no-store, max-age=0",
NO_STORE_CACHE_CONTROL,
);
const scanTerminalProxySource = fs.readFileSync(
@@ -101,6 +101,16 @@ export function runTests() {
/cacheControlForData\?:/,
"generic backend JSON proxy should allow response cache policy to depend on parsed data",
);
assert.match(
apiProxySource,
/Cloudflare-CDN-Cache-Control/,
"generic backend JSON proxy should expose Cloudflare-specific cache directives",
);
assert.match(
apiProxySource,
/NO_STORE_CACHE_CONTROL/,
"generic backend JSON proxy errors must remain non-cacheable when Cache Everything is enabled",
);
const scanTerminalProxy = readFrontend("app", "api", "scan", "terminal", "route.ts");
assert.match(scanTerminalProxy, /createProxyTimer\(req,\s*"scan_terminal"\)/);
+16 -2
View File
@@ -9,6 +9,7 @@ import {
finishProxyTimedResponse,
type ProxyTimer,
} from "@/lib/proxy-timing";
import { NO_STORE_CACHE_CONTROL } from "@/lib/proxy-cache-policy";
const PASSTHROUGH_UPSTREAM_STATUSES = new Set([
400,
@@ -85,6 +86,10 @@ export function buildUpstreamErrorResponse(
}
return NextResponse.json(body, {
headers: {
"Cache-Control": NO_STORE_CACHE_CONTROL,
"Cloudflare-CDN-Cache-Control": NO_STORE_CACHE_CONTROL,
},
status: clientStatusFromUpstream(upstreamStatus),
});
}
@@ -106,7 +111,13 @@ export function buildProxyExceptionResponse(
body.detail = String(error);
}
return NextResponse.json(body, { status: options.status ?? 500 });
return NextResponse.json(body, {
headers: {
"Cache-Control": NO_STORE_CACHE_CONTROL,
"Cloudflare-CDN-Cache-Control": NO_STORE_CACHE_CONTROL,
},
status: options.status ?? 500,
});
}
export async function proxyBackendJsonGet(
@@ -185,7 +196,10 @@ export async function proxyBackendJsonGet(
? buildCachedJsonResponse(req, data, responseCacheControl)
: NextResponse.json(data, {
headers: responseCacheControl
? { "Cache-Control": responseCacheControl }
? {
"Cache-Control": responseCacheControl,
"Cloudflare-CDN-Cache-Control": responseCacheControl,
}
: undefined,
});
const withCookies = applyAuthResponseCookies(response, auth.response);
+1
View File
@@ -28,6 +28,7 @@ export function buildCachedJsonResponse(
const etag = buildEtag(body);
const headers = new Headers({
"Cache-Control": cacheControl,
"Cloudflare-CDN-Cache-Control": cacheControl,
ETag: etag,
"Content-Type": "application/json; charset=utf-8",
});
+51 -11
View File
@@ -4,7 +4,32 @@ export type ProxyCachePolicy = {
revalidateSeconds?: number;
};
const NO_STORE_CACHE_CONTROL = "no-store, max-age=0";
export const NO_STORE_CACHE_CONTROL = "no-store, max-age=0";
export const CLOUDFLARE_EDGE_TTL_SEC = {
cityDetail: 60,
cityDetailStale: 300,
cityList: 300,
cityListStale: 3600,
landingPage: 600,
scanTerminal: 300,
scanTerminalStale: 900,
staticAsset: 31536000,
systemStatus: 60,
} as const;
export function buildPublicEdgeCacheControl(
sMaxageSeconds: number,
staleWhileRevalidateSeconds = Math.max(sMaxageSeconds * 3, 30),
browserMaxAgeSeconds = 0,
) {
return [
"public",
`max-age=${Math.max(0, Math.floor(browserMaxAgeSeconds))}`,
`s-maxage=${Math.max(1, Math.floor(sMaxageSeconds))}`,
`stale-while-revalidate=${Math.max(0, Math.floor(staleWhileRevalidateSeconds))}`,
].join(", ");
}
export function isForceRefreshValue(value: string | null | undefined) {
return String(value || "").trim().toLowerCase() === "true";
@@ -12,7 +37,7 @@ export function isForceRefreshValue(value: string | null | undefined) {
export function buildForceRefreshProxyCachePolicy(
forceRefresh: string | null | undefined,
revalidateSeconds = 15,
revalidateSeconds: number = CLOUDFLARE_EDGE_TTL_SEC.scanTerminal,
): ProxyCachePolicy {
if (isForceRefreshValue(forceRefresh)) {
return {
@@ -22,17 +47,17 @@ export function buildForceRefreshProxyCachePolicy(
}
return {
fetchMode: "revalidate",
responseCacheControl: `public, max-age=0, s-maxage=${revalidateSeconds}, stale-while-revalidate=${Math.max(
revalidateSeconds * 3,
30,
)}`,
responseCacheControl: buildPublicEdgeCacheControl(
revalidateSeconds,
Math.max(revalidateSeconds * 3, CLOUDFLARE_EDGE_TTL_SEC.scanTerminalStale),
),
revalidateSeconds,
};
}
export function buildCityDetailProxyCachePolicy(
forceRefresh: string | null | undefined,
revalidateSeconds = 15,
revalidateSeconds: number = CLOUDFLARE_EDGE_TTL_SEC.cityDetail,
): ProxyCachePolicy {
if (isForceRefreshValue(forceRefresh)) {
return {
@@ -42,14 +67,29 @@ export function buildCityDetailProxyCachePolicy(
}
return {
fetchMode: "revalidate",
responseCacheControl: `public, max-age=${revalidateSeconds}, s-maxage=${revalidateSeconds}, stale-while-revalidate=${Math.max(
revalidateSeconds * 3,
30,
)}`,
responseCacheControl: buildPublicEdgeCacheControl(
revalidateSeconds,
Math.max(revalidateSeconds * 3, CLOUDFLARE_EDGE_TTL_SEC.cityDetailStale),
Math.min(revalidateSeconds, 30),
),
revalidateSeconds,
};
}
export function buildCityListCacheControl() {
return buildPublicEdgeCacheControl(
CLOUDFLARE_EDGE_TTL_SEC.cityList,
CLOUDFLARE_EDGE_TTL_SEC.cityListStale,
);
}
export function buildStaticCityListFallbackCacheControl() {
return buildPublicEdgeCacheControl(
CLOUDFLARE_EDGE_TTL_SEC.cityList,
CLOUDFLARE_EDGE_TTL_SEC.cityListStale,
);
}
export function buildScanTerminalResponseCacheControl(
data: unknown,
readyCacheControl: string,
+28 -3
View File
@@ -3,15 +3,40 @@ const nextConfig = {
output: "standalone",
reactStrictMode: true,
async headers() {
const cacheHeader = {
const immutableCacheHeader = {
key: "Cache-Control",
value: "public, max-age=31536000, immutable",
};
const immutableCloudflareCacheHeader = {
key: "Cloudflare-CDN-Cache-Control",
value: "public, max-age=31536000, immutable",
};
const publicPageHeaders = [
{
key: "Cache-Control",
value: "public, max-age=0, s-maxage=600, stale-while-revalidate=3600",
},
{
key: "Cloudflare-CDN-Cache-Control",
value: "public, max-age=600, stale-while-revalidate=3600",
},
];
const staticExts = ["jpg", "jpeg", "png", "gif", "ico", "svg", "webp", "avif", "woff2", "ttf", "eot", "css", "js"];
return staticExts.map((ext) => ({
const staticAssetRules = staticExts.map((ext) => ({
source: `/:path(.+\\.${ext})`,
headers: [cacheHeader],
headers: [immutableCacheHeader, immutableCloudflareCacheHeader],
}));
const publicPageRules = [
"/",
"/docs/:path*",
"/modern/:path*",
"/probabilities/:path*",
"/subscription-help/:path*",
].map((source) => ({
source,
headers: publicPageHeaders,
}));
return [...staticAssetRules, ...publicPageRules];
},
};