Write serverless edge worker c…

# Cloudflare Worker：/product/* 边缘缓存方案

实现思路

• 拦截发往 shop.example.com/product/* 的请求
• 使用 Cache API（caches.default）在边缘存储响应，TTL 300 秒
• 通过自定义头 x-cache: HIT / MISS / BYPASS 标识命中情况

完整代码

```javascript

const CACHE_TTL = 300;

export default {

async fetch(request, env, ctx) {

const url = new URL(request.url);

// 仅对 GET/HEAD 且 /product/* 路径走缓存逻辑

const isCacheable =

request.method === 'GET' &&

url.pathname.startsWith('/product/');

if (!isCacheable) {

return fetch(request);

}

const cache = caches.default;

const cacheKey = new Request(url.toString(), request);

// 1. 查边缘缓存

const cached = await cache.match(cacheKey);

if (cached) {

const res = new Response(cached.body, cached);

res.headers.set('x-cache', 'HIT');

return res;

}

// 2. 回源并写缓存

const originRes = await fetch(request);

if (originRes.ok) {

const cacheableRes = new Response(originRes.clone().body, originRes);

cacheableRes.headers.set('Cache-Control', public, max-age=${CACHE_TTL});

cacheableRes.headers.set('x-cache', 'MISS');

// waitUntil 异步写缓存，不阻塞响应

ctx.waitUntil(cache.put(cacheKey, cacheableRes));

}

const res = new Response(originRes.body, originRes);

res.headers.set('x-cache', originRes.ok ? 'MISS' : 'BYPASS');

return res;

},

};

```

部署配置要点

• 绑定域名：在 Cloudflare Dashboard 中将 Worker 路由绑定 shop.example.com/product/*（需域名已托管在该账户）
• Wrangler 配置（wrangler.toml）：

```toml

name = "product-edge-cache"

main = "worker.js"

compatibility_date = "2024-01-01"

[[routes]]

pat