使用 Cloudflare R2 安全访问和上传资源

本教程介绍如何创建一个基于 TypeScript 的 Cloudflare Workers 项目，以安全地从 Cloudflare R2 存储桶访问文件并上传文件。Cloudflare R2 允许开发者存储大量非结构化数据，而无需支付典型云存储服务相关的高昂出口带宽费用。

要继续：

1. 如尚未注册，请注册 Cloudflare 账户 ↗。
2. 安装 npm ↗。
3. 安装 Node.js ↗。使用 Volta ↗ 或 nvm ↗ 等 Node 版本管理器，以避免权限问题并切换 Node.js 版本。Wrangler 需要 Node 版本 16.17.0 或更高。

首先，使用 create-cloudflare CLI ↗ 创建新 Worker。打开终端窗口并运行以下命令：

npm create cloudflare@latest -- upload-r2-assets

yarn create cloudflare upload-r2-assets

pnpm create cloudflare@latest upload-r2-assets

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

• 对于 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?，选择 TypeScript。
• 对于 Do you want to use git for version control?，选择 Yes。
• 对于 Do you want to deploy your application?，选择 No（部署前我们还会做一些修改）。

进入新创建的目录：

cd upload-r2-assets

在将 R2 存储桶访问集成到 Worker 应用之前，必须先创建 R2 存储桶：

npx wrangler r2 bucket create <YOUR_BUCKET_NAME>

将 <YOUR_BUCKET_NAME> 替换为要分配给存储桶的名称。列出账户的 R2 存储桶以验证新存储桶已添加：

npx wrangler r2 bucket list

新 R2 存储桶就绪后，在 Worker 应用中使用它。

通过修改 Wrangler 配置文件 以包含 R2 存储桶绑定（binding），在 Worker 项目中使用该 R2 存储桶。将以下 R2 存储桶绑定添加到 Wrangler 文件：

{
	"r2_buckets": [
		{
			"binding": "MY_BUCKET",
			"bucket_name": "<YOUR_BUCKET_NAME>"
		}
	]
}

[[r2_buckets]]
binding = "MY_BUCKET"
bucket_name = "<YOUR_BUCKET_NAME>"

为 R2 存储桶绑定命名。将 <YOUR_BUCKET_NAME> 替换为之前创建的 R2 存储桶名称。

Worker 应用现在可以使用 MY_BUCKET 变量访问 R2 存储桶。你可以对存储桶内容执行 CRUD（创建、读取、更新、删除）操作。

设置 R2 存储桶绑定后，将实现 Worker 与 R2 存储桶交互的功能，例如从存储桶获取文件和向存储桶上传文件。

要从 R2 存储桶获取文件，使用 BINDING.get 函数。在以下示例中，R2 存储桶绑定名为 MY_BUCKET。使用 .get(key)，你可以根据 URL 路径名作为键检索资源。在此示例中，URL 路径名为 /image.png，资源键为 image.png。

interface Env {
	MY_BUCKET: R2Bucket;
}
export default {
	async fetch(request, env): Promise<Response> {
		// For example, the request URL my-worker.account.workers.dev/image.png
		const url = new URL(request.url);
		const key = url.pathname.slice(1);
		// Retrieve the key "image.png"
		const object = await env.MY_BUCKET.get(key);

		if (object === null) {
			return new Response("Object Not Found", { status: 404 });
		}

		const headers = new Headers();
		object.writeHttpMetadata(headers);
		headers.set("etag", object.httpEtag);

		return new Response(object.body, {
			headers,
		});
	},
} satisfies ExportedHandler<Env>;

上述代码在使用特定 URL 路径向 Worker 应用发出 GET 请求时，从 R2 存储桶获取并返回数据。

接下来，你将添加使用身份验证上传到 R2 存储桶的功能。要安全验证上传请求，使用 Wrangler 的 secret 功能。运行 create cloudflare@latest 命令时已安装 Wrangler。

创建你选择的 secret 值——例如随机字符串或密码。使用 Wrangler CLI 将 secret 添加到项目中，命名为 AUTH_SECRET：

npx wrangler secret put AUTH_SECRET

现在，添加处理 PUT HTTP 请求的新代码路径。此新代码将检查之前上传的 secret 是否正确用于身份验证，然后使用 MY_BUCKET.put(key, data) 上传到 R2：

interface Env {
	MY_BUCKET: R2Bucket;
	AUTH_SECRET: string;
}
export default {
	async fetch(request, env): Promise<Response> {
		if (request.method === "PUT") {
			// Note that you could require authentication for all requests
			// by moving this code to the top of the fetch function.
			const auth = request.headers.get("Authorization");
			const expectedAuth = `Bearer ${env.AUTH_SECRET}`;

			if (!auth || auth !== expectedAuth) {
				return new Response("Unauthorized", { status: 401 });
			}

			const url = new URL(request.url);
			const key = url.pathname.slice(1);
			await env.MY_BUCKET.put(key, request.body);
			return new Response(`Object ${key} uploaded successfully!`);
		}

		// include the previous code here...
	},
} satisfies ExportedHandler<Env>;

此方法确保只有提供有效 bearer token 的客户端（通过 Authorization 头，值等于 AUTH_SECRET）才被允许上传到 R2 存储桶。如果你使用的绑定名称不是 AUTH_SECRET，请在上述代码中替换。

完成 Cloudflare Worker 项目后，将其部署到 Cloudflare。确保位于为本教程创建的 Worker 应用目录中，然后运行：

npx wrangler deploy

你的应用现已上线，可通过 <YOUR_WORKER>.<YOUR_SUBDOMAIN>.workers.dev 访问。

你已成功创建 Cloudflare Worker，可与 R2 存储桶交互以完成上传和下载文件等任务。你现在可以此为基础开展自己的项目。

要了解更多 R2 与 Workers 的构建内容，请参阅教程和 R2 文档。

如有任何问题、需要帮助或想分享你的项目，请加入 Cloudflare 开发者社区 Discord ↗，与其他开发者和 Cloudflare 团队交流。