AI-NEWS · 2024年 10月 26日

CloudFlare 使用 Workers 和 Nextjs 的深度集成

### Cloudflare 产品和服务总结

#### Cloudflare Pages 和 Next.js 集成
Cloudflare 提供了与 Next.js 的集成,称为 OpenNext。这允许用户在 Cloudflare 平台上使用 Next.js 构建和部署静态或动态应用程序。

#### 使用 Cloudflare Workers
1. **Worker HTTP/WebSocket Fetch Handler**: 这个处理程序用于处理 HTTP 和 WebSocket 请求。
2. **Email Handler**: 用于处理电子邮件请求,可以设置转发规则等。
3. **Scheduled Handler**: 允许用户定义定时任务,在特定时间执行预定的操作。

#### 构建和部署工作流程
1. 使用 `wrangler.toml` 文件配置 Cloudflare Workers 环境。文件中需要指定 `main` 属性指向入口点,例如 `"srcworker.ts"`。
2. 在项目根目录下创建 `.worker-nextindex.mjs` 文件,使用 `npm run preview/deploy` 命令构建和部署应用。

#### Worker 代码示例
```typescript
import build from "...worker-nextindex.mjs";
export default {
    fetch: PagesFunction.fetch,
    async fetch(request: Request, env: CloudflareEnv, ctx: ExecutionContext): Promise<Response> {
        return PagesFunction.fetch(request, env, ctx);
    },
    async scheduled(event, env, ctx) {
        ctx.waitUntil(doSomeTaskOnASchedule());
    },
    async email(message, env, ctx) {
        message.forward("");
    }
} as satisfies ExportedHandler;

通过这些组件和工具,Cloudflare 提供了一个全面的平台来构建、部署和管理现代 Web 应用程序。
“`

Source:https://baoyu.io/blog/cloudflare/cloudflare-workers-nextjs-deep-integration