利用CloudFlare Pages搭建免费图床!

图片1

效果预览:https://img.qmsdh.com/

说明:

教程制作:秋名山 qmsdh.com

仓库地址:https://github.com/cf-pages/Telegraph-Image

特性:

1.无限图片储存数量,你可以上传不限数量的图片

2.无需购买服务器,托管于 Cloudflare 的网络上,当使用量不超过 Cloudflare 的免费额度时,完全免费

3.无需购买域名,可以使用 Cloudflare Pages 提供的*.pages.dev的免费二级域名,同时也支持绑定自定义域名

4.支持图片审查 API,可根据需要开启,开启后不良图片将自动屏蔽,不再加载

5.支持后台图片管理,可以对上传的图片进行在线预览,添加白名单,黑名单等操作

准备条件:

一个GitHub账号,一个CloudFlare账号,没有可以点这里注册

部署教程:

  1. 用 GitHub先Fork一下这个仓库地址:
    https://github.com/cf-pages/Telegraph-Image
  2. 打开cloudflare首页,依次进入:首页 - 左上角的三个横杠 - workers&pages - 创建 - pages - 连接到git,连接完成后选择你刚才fork的项目

图片2

  1. 依照提示输入你要设置的cloudflare项目名,再点“部署”即可!

绑定自己的域名

在pages - 自定义域 中,设置自定义域名,可以自行选择任意域名(在cf中的点“激活域”会自动激活,没转入cf解析的域名也可以选择手动解析)

图片3

图片管理

1、支持图片管理功能,默认是关闭的,如需开启请部署完成后前往后台依次点击设置->函数->KV 命名空间绑定->编辑绑定->变量名称填写:img_url KV 命名空间 选择你提前创建好的 KV 储存空间,开启后访问 http(s)://你的域名/admin 即可打开后台管理页面

变量名称:img_url
KV 命名空间:选择提前创建好的 KV 储存空间

图片4
图片5

2、后台管理页面新增登录验证功能,默认也是关闭的,如需开启请部署完成后前往后台依次点击设置->环境变量->为生产环境定义变量->编辑变量 添加如下表格所示的变量即可开启登录验证

变量名称 值
BASIC_USER = <后台管理页面登录用户名称>
BASIC_PASS = <后台管理页面登录用户密码>

图片6

当然你也可以不设置这两个值,这样访问后台管理页面时将无需验证,直接跳过登录步骤,这一设计使得你可以结合 Cloudflare Access 进行使用,实现支持邮件验证码登录,Microsoft 账户登录,Github 账户登录等功能,能够与你域名上原有的登录方式所集成,无需再次记忆多一组后台的账号密码,添加 Cloudflare Access 的方式请参考官方文档,注意需要保护路径包括/admin 以及 /api/manage/*

开启图片审查

1.请前往https://moderatecontent.com/ 注册并获得一个免费的用于审查图像内容的 API key

2.打开 Cloudflare Pages 的管理页面,依次点击设置,环境变量,添加环境变量

3.添加一个变量名称为ModerateContentApiKey,值为你刚刚第一步获得的API key,点击保存即可

注意:由于所做的更改将在下次部署时生效,你或许还需要进入部署页面,重新部署一下该本项目

开启图片审查后,因为审查需要时间,首次的图片加载将会变得缓慢,之后的图片加载由于存在缓存,并不会受到影响

图片7

限制

1.由于图片文件实际存储于 Telegraph,Telegraph 限制上传的图片大小最大为 5MB

2.由于使用 Cloudflare 的网络,图片的加载速度在某些地区可能得不到保证(CF Pages利用CF优选加速教程

3.Cloudflare Function 免费版每日限制 100,000 个请求(即上传或是加载图片的总次数不能超过 100,000 次)如超过可能需要选择购买 Cloudflare Function 的付费套餐,如开启图片管理功能还会存在 KV 操作数量的限制,如超过需购买付费套餐