Hello! 欢迎来到小浪资源网!



使用 Cloudflare Workers 实施 Gmail 发送 – 开发指南


avatar
1986424546 2024-11-20 26

使用 Cloudflare Workers 实施 Gmail 发送 – 开发指南

这是使用 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 存储解决方案集成:

  1. d1:

    • 基于 sqlite 的无服务器 sql 数据库
    • 高达10gb存储容量
    • 30天时间旅行功能
  2. kv(键值):

    • 全球分布式键值存储
    • 针对边缘阅读进行了优化
  3. 耐用物体

    • 一致的状态管理
    • 分布式系统的理想选择
  4. r2:

    • s3 兼容的对象存储
    • 大文件处理能力
  5. 超级光驱:

关于牧马人的重要说明

最近牧马人使用模式的变化需要引起注意。以前,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 部分,我们将把所有内容与实际实现结合起来。

相关阅读