跳转到内容
搜索文档
↵选择
↑↓导航
ESC关闭

CLI

最后更新 查看 MarkdownAgent 设置

使用 Cloudflare Developer Platform CLI——Wrangler，配置并部署你的第一个 Worker。

本指南将引导你完成第一个 Worker 的配置与部署。

前置条件

  1. 注册 Cloudflare 账户 ↗。
  2. 安装 Node.js ↗。

Node.js 版本管理器

使用 Volta ↗ 或 nvm ↗ 等 Node 版本管理器，以避免权限问题并切换 Node.js 版本。本指南后续将介绍的 Wrangler 需要 Node 版本 16.17.0 或更高。

1. 创建新的 Worker 项目

打开终端窗口并运行 C3 来创建 Worker 项目。C3 (create-cloudflare-cli) ↗ 是一款命令行工具，用于帮助你在 Cloudflare 上设置和部署新应用。

npm create cloudflare@latest -- my-first-worker

进行设置时，请选择以下选项：

  • 对于 What would you like to start with?，选择 Hello World example。
  • 对于 Which template would you like to use?，选择 Worker only。
  • 对于 Which language do you want to use?，选择 JavaScript。
  • 对于 Do you want to use git for version control?，选择 Yes。
  • 对于 Do you want to deploy your application?，选择 No（部署前我们还会做一些修改）。

现在，你已有一个新项目。进入该项目文件夹。

cd my-first-worker

C3 创建了哪些文件？

在项目目录中，C3 会生成以下内容：

如果已有 Git 仓库中的项目怎么办？

除从 C3 模板创建新项目外，C3 还支持从现有 Git 仓库创建新项目。要从现有 Git 仓库创建新项目，请打开终端并运行：

npm create cloudflare@latest -- --template <SOURCE>

<SOURCE> 可以是以下任意一种：

  • user/repo (GitHub)
  • git@github.com:user/repo
  • https://github.com/user/repo
  • user/repo/some-template (subdirectories)
  • user/repo#canary (branches)
  • user/repo#1234abcd (commit hash)
  • bitbucket:user/repo (Bitbucket)
  • gitlab:user/repo (GitLab)

你的现有模板文件夹至少必须包含以下文件，才能满足 Cloudflare Workers 的要求：

2. 使用 Wrangler CLI 开发

C3 默认会在 Workers 项目中安装 Wrangler，即 Workers 命令行界面。Wrangler 可让你创建、测试和部署 Workers 项目。

创建第一个 Worker 后，在项目目录中运行 wrangler dev 命令，启动用于开发 Worker 的本地服务器。这样可以在开发期间在本地预览 Worker。

npx wrangler dev

如果你从未使用过 Wrangler，它会打开网页浏览器，以便你登录 Cloudflare 账户。

前往 http://localhost:8787 ↗ 查看你的 Worker。

浏览器有问题？

如果此步骤遇到问题，或你无法使用浏览器界面，请参阅 wrangler login 文档。

3. 编写代码

生成并运行新项目后，你可以开始编写和编辑代码。

找到 src/index.js 文件。index.js 将包含以下代码：

Original index.jsjs
export default {
	async fetch(request, env, ctx) {
		return new Response("Hello World!");
	},
};

代码说明

此代码块包含几个不同部分。

Updated index.jsjs
export default {
	async fetch(request, env, ctx) {
		return new Response("Hello World!");
	},
};

export default 是定义 JavaScript 模块 ↗ 所需的 JavaScript 语法。你的 Worker 必须默认导出一个对象，其属性对应 Worker 应处理的事件。

index.jsjs
export default {
	async fetch(request, env, ctx) {
		return new Response("Hello World!");
	},
};

当你的 Worker 收到 HTTP 请求时，将调用此 fetch() 处理程序。你可以在导出对象中定义其他事件处理程序，以响应不同类型的事件。例如，添加 scheduled() 处理程序，通过 Cron Trigger 响应 Worker 调用。

此外，fetch 处理程序始终会传入三个参数：request、env 和 context。

index.jsjs
export default {
	async fetch(request, env, ctx) {
		return new Response("Hello World!");
	},
};

Workers 运行时要求 fetch 处理程序返回 Response 对象，或解析为 Response 对象的 Promise。在此示例中，你将返回包含字符串 "Hello World!" 的新 Response。

将当前 index.js 文件中的内容替换为以下内容，以更改文本输出。

index.jsjs
export default {
	async fetch(request, env, ctx) {
		return new Response("Hello Worker!");
	},
};

然后保存文件并刷新页面。Worker 的输出将变为新文本。

看不到变化？

如果 Worker 的输出没有变化，请确认：

  1. 你已保存对 index.js 的更改。
  2. 你正在运行 wrangler dev。
  3. 你已刷新浏览器。

4. 部署项目

通过 Wrangler 将 Worker 部署到 *.workers.dev 子域名或自定义域名。

npx wrangler deploy

如果你尚未配置任何子域名或域名，Wrangler 会在发布过程中提示你进行设置。

在 <YOUR_WORKER>.<YOUR_SUBDOMAIN>.workers.dev 预览你的 Worker。

看到 523 错误？

首次推送 *.workers.dev 子域名时若看到 523 错误，请等待一分钟左右，错误会自行消失。

后续步骤

如需了解更多：

这篇文档对您有帮助吗？