边缘网络:白嫖 Cloudflare R2 博客图床(DNS 国内外分流)

Published: 2024-09-08

Tags: Software

本文总阅读量

上篇博客《边缘网络:白嫖 Cloudflare Pages 静态博客(DNS 国内外分流)》 将博客的静态页面发布到 Cloudflare Pages 并使用 DNS 分流,本篇将沿用这一方案,继续将博客的图床改造

本篇主要内容是记录 R2 存储如何绑定自定义域名访问

配置 Cloudflare for SaaS 订阅

进到 Website 下

首次使用需要先开启 Cloudflare for SaaS 订阅

添加回退源(Fallback Origin),需要是 Clouldflare 管理的域名,同时应该是有效的(A...) 记录,此处填写的 r2-n6xd83.donx-done.xyz 作为默认 Fallback Origin 仅仅是为了让后续的 images.yasking.org 能够 CNAME 绑定到 Cloudflare,images.yasking.org 并不能通过 r2-n6xd83.donx-done.xyz 访问到 R2 的资源

作为说明,如果 fallback.donx-done.xyz 是有效的解析,也是可以作为 Fallback Origin,本例中只需要一个有效的回退源

如果 r2-n6xd83.donx-done.xyz 被改为了不存在的 fallback.donx-done.xyz 则会触发报错

正确添加后显示为 Active

点击 “Add Custom Hostname” 配置自定义域名

此处填写图床域名 images.yasking.org,其它保持默认即可

点击刚刚添加的记录,按提示在 DNSPod 上添加两条 TXT 记录

解析后稍作等待,刷新后可以看到两个 Active

至此,Cloudflare 已准备好接收来自 images.yasking.org 域名的请求(但不能正确处理返回图片,仅仅是解析)

添加域名解析

将 images.yasking.org 通过 CNAME 指向 r2-n6xd83.donx-done.xyz

到这一步,从感觉上已经能访问 R2 图像,上文说过原因,访问 R2 内的文件,从报错上也可以看到提示,R2 不能直接由自定义域名的 CNAME 解析访问

配置 Cloudflare Worker 并绑定 R2 桶

回到 Workers & Pages

新建 Worker

选择从模版创建,随便选择

填写名称

点击 Deploy 部署,成功后点击 “Edit code”

将以下内容粘贴到 worker.js,保存后再次点击 Deploy 部署

var worker_default = {
  async fetch(request, env) {
    if (request.method !== "GET") {
      return new Response("Only GET method allowed", { status: 405 });
    }
    const url = new URL(request.url);
    const key = url.pathname.slice(1);
    const object = await env.MY_BUCKET.get(key);
    if (!object) {
      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
    });
  }
};

export {
  worker_default as default
};

来到 Worder 设置,添加 R2 绑定

变量名是 MY_BUCKET,选择 blog 的图片存储桶

绑定后如图

添加 Cloudflare 路由

回到 Zones 中,选择托管的域名,添加 Workers 路由

点击 “Add route” 添加路由

填写图床域名,非 Cloudflare 托管的域名

添加完成

此时,通过 images.yasking.org 可以访问 R2 内图像,链路如图

示例链接

https://images.yasking.org/photos/1680170549/01.jpg

访问测试

从国外服务器访问,显示 cloudflare 服务器

国内访问,维持原又拍云 CDN

配置完成 ✅

参考