这是使用 cloudflare workers 实施 gmail 发送系列的第 2 部分:
- 第 1 部分:设置 ✅
- 第 2 部分:开发环境(当前)
- 第 3 部分:实施(即将推出)
介绍
在第 1 部分中设置 gmail api 访问权限后,我们现在将为 cloudflare workers 配置开发环境。本指南重点介绍创建一个与 cloudflare pages 和 workers 无缝协作的强大开发设置。
了解 cloudflare 基础设施
cloudflare 在全球分布式边缘计算平台上运行。当流量增加时,页面会在这些服务器之间复制,并将用户定向到最近的服务器。这种无服务器架构无需管理您自己的服务器、docker 容器或 kubernetes 集群。
cloudflare 工作人员和页面
工人概况
cloudflare workers 是处理请求的无服务器函数。 cloudflare pages 处理前端(静态内容),而 workers 则管理表单处理和电子邮件发送等后端操作。
可用的存储选项
workers 可以与各种 cloudflare 存储解决方案集成:
-
d1:
-
kv(键值):
- 全球分布式键值存储
- 针对边缘阅读进行了优化
-
耐用物体:
- 一致的状态管理
- 分布式系统的理想选择
-
r2:
- s3 兼容的对象存储
- 大文件处理能力
-
超级光驱:
- postgresql 数据库连接器
- 优化连接池
关于牧马人的重要说明
最近牧马人使用模式的变化需要引起注意。以前,wrangler 通常是全局安装的,但推荐的方法已更改:
旧方法(不推荐):
npm install -g wrangler wrangler init my-project
新推荐方法:
npm create cloudflare@latest
此更改提供了更好的项目隔离和版本管理。
cloudflare worker 中的语言环境
虽然 cloudflare workers 可能看起来与 node.JS 类似,但存在重要差异:
- 原生 node.js 模块不可用
- 代码必须与浏览器兼容
- 支持 typescript,提供强大的打字优势
- 每个项目安装 node.js 仅用于开发
- 必须使用直接 http 请求而不是 node.js 库
了解 cloudflare 页面应用程序
cloudflare pages 应用程序与传统 workers 不同:
- 它们是在 cloudflare pages 平台上运行的完全集成的 web 应用程序
- pages functions 通过 /functions 目录扩展此功能
- 此集成允许直接在您的页面应用程序中进行服务器端处理(例如电子邮件处理)
- 使用pages functions时不需要单独部署worker
开发环境设置
1. 前提条件
- 创建 cloudflare 帐户
- 将 github 存储库连接到 pages
- 配置部署设置
2. 项目结构设置
创建以下目录结构:
your-project/ ├── src/ │ └── pages/ │ └── index.astro ├── functions/ │ ├── contact-form.ts │ └── tsconfig.json ├── public/ ├── astro.config.mjs ├── package.json └── wrangler.toml
初始化为:
mkdir functions touch functions/contact-form.ts functions/tsconfig.json wrangler.toml
3.安装依赖项
npm install --save-dev typescript @cloudflare/workers-types
4. 配置 typescript
添加到functions/tsconfig.json:
{ "compileroptions": { "target": "esnext", "module": "esnext", "lib": ["esnext"], "types": ["@cloudflare/workers-types"], "sourcemap": true } }
更新项目 tsconfig.json:
{ "include": ["src/**/*"], "exclude": ["functions/**/*"] }
下一步
本系列的下一篇文章将介绍实现细节,包括:
- 创建邮件发送功能
- 处理表单提交
- 错误处理和验证
- 测试和部署
请继续关注第 3 部分,我们将把所有内容与实际实现结合起来。