[ PROMPT_NODE_24194 ]
Pages 设计模式
[ SKILL_DOCUMENTATION ]
# 模式
## API 路由
typescript
// functions/api/todos/[id].ts
export const onRequestGet: PagesFunction = async ({ env, params }) => {
const todo = await env.DB.prepare('SELECT * FROM todos WHERE id = ?').bind(params.id).first();
if (!todo) return new Response('Not found', { status: 404 });
return Response.json(todo);
};
export const onRequestPut: PagesFunction = async ({ env, params, request }) => {
const body = await request.json();
await env.DB.prepare('UPDATE todos SET title = ?, completed = ? WHERE id = ?')
.bind(body.title, body.completed, params.id).run();
return Response.json({ success: true });
};
// Also: onRequestDelete, onRequestPost
## 身份验证中间件
typescript
// functions/_middleware.ts
const auth: PagesFunction = async (context) => {
if (context.request.url.includes('/public/')) return context.next();
const authHeader = context.request.headers.get('Authorization');
if (!authHeader?.startsWith('Bearer ')) {
return new Response('Unauthorized', { status: 401 });
}
try {
const payload = await verifyJWT(authHeader.substring(7), context.env.JWT_SECRET);
context.data.user = payload;
return context.next();
} catch (err) {
return new Response('Invalid token', { status: 401 });
}
};
export const onRequest = [auth];
## CORS
typescript
// functions/api/_middleware.ts
const corsHeaders = {
'Access-Control-Allow-Origin': '*',
'Access-Control-Allow-Methods': 'GET, POST, PUT, DELETE, OPTIONS',
'Access-Control-Allow-Headers': 'Content-Type, Authorization'
};
export const onRequest: PagesFunction = async (context) => {
if (context.request.method === 'OPTIONS') {
return new Response(null, {headers: corsHeaders});
}
const response = await context.next();
Object.entries(corsHeaders).forEach(([k, v]) => response.headers.set(k, v));
return response;
};
## 表单处理
typescript
// functions/api/contact.ts
export const onRequestPost: PagesFunction = async ({ request, env }) => {
const formData = await request.formData();
await env.QUEUE.send({name: formData.get('name'), email: formData.get('email')});
return new Response('
Thanks!
', { headers: { 'Content-Type': 'text/html' } });
};
## 后台任务
typescript
export const onRequestPost: PagesFunction = async ({ request, waitUntil }) => {
const data = await request.json();
waitUntil(fetch('https://api.example.com/webhook', {
method: 'POST', body: JSO