1### Common Patterns
2 
3**1. Forward request to assets:**
4 
5```typescript
6export default {
7  async fetch(request: Request, env: Env): Promise<Response> {
8    return env.ASSETS.fetch(request);
9  }
10};
11```
12 
13**2. Fetch specific asset by path:**
14 
15```typescript
16const response = await env.ASSETS.fetch("https://assets.local/logo.png");
17```
18 
19**3. Modify request before fetching asset:**
20 
21```typescript
22const url = new URL(request.url);
23url.pathname = "/index.html";
24return env.ASSETS.fetch(new Request(url, request));
25```
26 
27**4. Transform asset response:**
28 
29```typescript
30const response = await env.ASSETS.fetch(request);
31const modifiedResponse = new Response(response.body, response);
32modifiedResponse.headers.set("X-Custom-Header", "value");
33modifiedResponse.headers.set("Cache-Control", "public, max-age=3600");
34return modifiedResponse;
35```
36 
37**5. Conditional asset serving:**
38 
39```typescript
40export default {
41  async fetch(request: Request, env: Env): Promise<Response> {
42    const url = new URL(request.url);
43    if (url.pathname === '/') {
44      return env.ASSETS.fetch('/index.html');
45    }
46    return env.ASSETS.fetch(request);
47  }
48};
49```
50 
51**6. SPA with API routes:**
52 
53Most common full-stack pattern - static SPA with backend API:
54 
55```typescript
56export default {
57  async fetch(request: Request, env: Env): Promise<Response> {
58    const url = new URL(request.url);
59    if (url.pathname.startsWith('/api/')) {
60      return handleAPI(request, env);
61    }
62    return env.ASSETS.fetch(request);
63  }
64};
65 
66async function handleAPI(request: Request, env: Env): Promise<Response> {
67  return new Response(JSON.stringify({ status: 'ok' }), {
68    headers: { 'Content-Type': 'application/json' }
69  });
70}
71```
72 
73**Config:** Set `run_worker_first: ["/api/*"]` (see configuration.md:66-106)
74 
75**7. Auth gating for protected assets:**
76 
77```typescript
78export default {
79  async fetch(request: Request, env: Env): Promise<Response> {
80    const url = new URL(request.url);
81    if (url.pathname.startsWith('/admin/')) {
82      const session = await validateSession(request, env);
83      if (!session) {
84        return Response.redirect('/login', 302);
85      }
86    }
87    return env.ASSETS.fetch(request);
88  }
89};
90```
91 
92**Config:** Set `run_worker_first: ["/admin/*"]`
93 
94**8. Custom headers for security:**
95 
96```typescript
97export default {
98  async fetch(request: Request, env: Env): Promise<Response> {
99    const response = await env.ASSETS.fetch(request);
100    const secureResponse = new Response(response.body, response);
101    secureResponse.headers.set('X-Frame-Options', 'DENY');
102    secureResponse.headers.set('X-Content-Type-Options', 'nosniff');
103    secureResponse.headers.set('Content-Security-Policy', "default-src 'self'");
104    return secureResponse;
105  }
106};
107```
108 
109**9. A/B testing via cookies:**
110 
111```typescript
112export default {
113  async fetch(request: Request, env: Env): Promise<Response> {
114    const cookies = request.headers.get('Cookie') || '';
115    const variant = cookies.includes('variant=b') ? 'b' : 'a';
116    const url = new URL(request.url);
117    if (url.pathname === '/') {
118      return env.ASSETS.fetch(`/index-${variant}.html`);
119    }
120    return env.ASSETS.fetch(request);
121  }
122};
123```
124 
125**10. Locale-based routing:**
126 
127```typescript
128export default {
129  async fetch(request: Request, env: Env): Promise<Response> {
130    const locale = request.headers.get('Accept-Language')?.split(',')[0] || 'en';
131    const url = new URL(request.url);
132    if (url.pathname === '/') {
133      return env.ASSETS.fetch(`/${locale}/index.html`);
134    }
135    if (!url.pathname.startsWith(`/${locale}/`)) {
136      url.pathname = `/${locale}${url.pathname}`;
137    }
138    return env.ASSETS.fetch(url);
139  }
140};
141```
142 
143**11. OAuth callback handling:**
144 
145```typescript
146export default {
147  async fetch(request: Request, env: Env): Promise<Response> {
148    const url = new URL(request.url);
149    if (url.pathname === '/auth/callback') {
150      const code = url.searchParams.get('code');
151      if (code) {
152        const session = await exchangeCode(code, env);
153        return new Response(null, {
154          status: 302,
155          headers: {
156            'Location': '/',
157            'Set-Cookie': `session=${session}; HttpOnly; Secure; SameSite=Lax`
158          }
159        });
160      }
161    }
162    return env.ASSETS.fetch(request);
163  }
164};
165```
166 
167**Config:** Set `run_worker_first: ["/auth/*"]`
168 
169**12. Cache control override:**
170 
171```typescript
172export default {
173  async fetch(request: Request, env: Env): Promise<Response> {
174    const response = await env.ASSETS.fetch(request);
175    const url = new URL(request.url);
176    // Immutable assets (hashed filenames)
177    if (/\.[a-f0-9]{8,}\.(js|css|png|jpg)$/.test(url.pathname)) {
178      return new Response(response.body, {
179        ...response,
180        headers: {
181          ...Object.fromEntries(response.headers),
182          'Cache-Control': 'public, max-age=31536000, immutable'
183        }
184      });
185    }
186    return response;
187  }
188};
189```
190