利用Cloudflare+Telegraph搭建零成本图床系统
前言
图床(Image Hosting Service)是指专门用来存储和托管用户上传的图片的在线服务。它们通常提供稳定的存储空间和快速的访问速度,使得用户可以方便地在互联网上分享图片,而不需要依赖自己的服务器或存储空间。
图像嵌入网页: 开发人员和网站管理员可以将图床提供的图片链接嵌入到网页中,用于展示产品图片、文章插图等。
减轻服务器负担: 网站或应用程序开发者使用图床可以减少自己服务器的负载,提高网站的响应速度和稳定性。
准备工作
一个GitHub账号
一个Cloudflare账号
最好拥有1个域名并托管在Cloudflare中(非必须)
部署教程
一、Fork 项目
打开项目https://github.com/cf-pages/Telegraph-Image,登录自己的Github帐号,在项目主页点击Fork按钮,Fork该项目
二、设置Fork
点击Fork后,页面中什么都不要改,直接点击Create fork按钮,等待片刻就创建完成了。这时候你自己的Github中就有了这个项目的镜像
三、连接Github仓库和部署图床
进入Workers和Pages概述界面,在Cloudflare主页,点击左侧Workers和Pages——概述——创建应用程序——Pages——连接到Git
点击页面中的连接到Git按钮,在弹出界面中选择Github,并点击连接Github按钮
链接时可只授权要使用到的仓库,选择Only Select repositories,并选择上面fork好的项目,然后点击Install & Authorize按钮,确认完成授权和开始安装
最后,Github可能会要求你输入账号密码,以确认上面的授权,输入你的Github密码并Confirm即可。上面确认授权后,会从Github自动跳回到Cloudflare,继续开始后续的部署设置。
四、部署到Cloudflare
首选,选中上面授权好的Github项目,点击开始设置
项目名称可以改成你自定义的名称(我这里默认Telegraph-Image),生产分支建议保持默认的 main,其他的地方不要修改,点击保存并部署,等待Pages自动部署项目
当看到成功提示时,表示我们的图床已经部署完成了。此时Cloudflare自动分配了一个默认的域名,直接点击即可打开图床的上传页面
如下图,Telegraph的上传界面非常简洁,直接点击选中上传图片或视频按钮即可进行上传
设置图床
以上过程就完成在Cloudflare中部署Telegraph图床系统了,不过这时候还存在一些问题,包括如何管理用户上传的内容?如何绑定自己的域名?如何审查用户上传的内容是否违规?下面一一来解答
一、配置管理后台
Telegraph的后台管理功能和登录验证功能默认都是关闭的,我们仅需对部署的Pages项目进行一些设置就可以开启这些功能了
1.创建KV命名空间
打开Workers和Pages——KV管理界面,然后点击右上角创建命名空间按钮,创建一个名为img_url的命名空间
2.查看Pages项目
回到Workers和Pages——>概述界面,找到上面部署好的Telegraph项目,直接点击名称,进入项目的详情页面
3.绑定KV命名空间
点击设置——函数,拉到页面的下面,找到KV命名空间绑定模块,点击添加绑定按钮,将变量名称和KV命名空间均设置为img_url,然后保存
4.设置管理后台登录验证
切换到环境变量页面,点击制作中的添加变量按钮,添加两个环境变量,变量名分别是BASIC_USER和BASIC_PASS,分别代表管理员的用户名和密码,然后保存
当然,你也可以不设置这两个变量,这时候管理后台就是无需验证即可登录。但是你可以结合Cloudflare Access服务实现支持邮件验证码、Microsoft、Github等第三方帐号登录方式,更加灵活强大。如果使用Cloudflare Access,则需要对/admin和/api/manage/*两个路径进行保护
5.重新部署
做完以上的操作并不会立即生效,需要重新部署下系统才可以。
重新部署也非常简单,点击查看详细信息,在项目部署详情信息页面的右上角有个管理部署,点击其中的重新部署,等待重新部署完成即可
6.登录管理后台
以上步骤操作完就实现了图床系统的管理后台功能和登录验证功能的设置,可以输入图床域名+/admin路径,就能打开管理后台了,打开后,在弹出框中输入上面设置好的用户名和密码即可
管理界面相对简陋,可以看到图片的状态信息,也可以对图片进行黑/白名单设置或删除操作
图片状态信息字段含义

7.绑定自定义域名
Cloudflare自动分配的域名不好记(当然,如果你能忍受就可以不自定义),我们可以设置成我们自己的域名,方便使用,设置也很简单
进入Pages项目切换到自定义域页面,点击设置自定义域,输入你自己想用的二级域名,并点击继续按钮,可以看到Cloudflare将自动在域名DNS中添加一个CNAME解析记录,将自定义域名指向默认分配的域名。直接点击激活域按钮,然后等待验证即可
二、开启内容审查
图床中上传的图片或视频默认是不经过审查的,上传后就可以被访问了。作为一个上传无需登录的图床,没有审核还是很危险的。如果被人恶意上传了不法内容,作为域名持有人,躺枪荣获"银手镯"就不妙了。Telegraph支持使用“moderatecontent”来进行自动内容审查,下面进行简单的配置就可以开启这项功能,强烈建议开启
1.获取API Key
打开"https://moderatecontent.com/"网站,点击SIGN UP,输入你的邮箱,点击SUBMIT,界面上就直接为你生成API Key,复制并保存下来
2.设置环境变量
打开 Cloudflare Pages 的管理页面,依次点击设置——环境变量——添加环境变量
添加一个变量名称为ModerateContentApiKey,值为你刚刚第一步获得的API key,点击保存即可
注意:由于所做的更改将在下次部署时生效,你或许还需要进入部署页面,重新部署一下该本项目
开启图片审查后,因为审查需要时间,首次的图片加载将会变得缓慢,之后的图片加载由于存在缓存,并不会受到影响
更新图床系统
如果Telegraph-Image项目更新了,如何才能更新自己部署的图床呢?
很简单,如果项目更新后,需要添加新的KV命名空间或环境变量,则先在Cloudflare的项目中配置好。然后到你自己的Github中,在Telegraph-Image项目页面上点击Sync fork——Update branch即可
更新完成后,稍等一会,等Cloudflare Pages那边检测到你的仓库更新了之后就会自动部署最新的代码了
限制
1.由于使用 Cloudflare 的网络,图片的加载速度在某些地区可能得不到保证
2.由于图片文件实际存储于 Telegraph,Telegraph 限制上传的图片大小最大为 5MB,开启图片审查后,不良图片会被自动屏蔽,不支持加载,加入白名单中的内容可绕过图片审查结果,无论是否通过都能正常加载。而加入黑名单的图片将无法正常加载,每次修改部署项目的KV、环境变量等,记得要重新部署,否则不会生效
3.Cloudflare KV 每天只有 1000 次的免费写入额度,每有一张新的图片加载都会占用该写入额度,如果超过该额度,图片管理后台将无法记录新加载的图片
4.每天最多 100,000 次免费读取操作,图片每加载一次都会占用该额度(在没有缓存的情况下,如果你的域名在 Cloudflare 开启了缓存,当缓存未命中时才会占用该额度),超过黑白名单等功能可能会失效
5.每天最多 1,000 次免费删除操作,每有一条图片记录都会占用该额度,超过将无法删除图片记录
6.每天最多 1,000 次免费列出操作,每打开或刷新一次后台/admin 都会占用该额度,超过将进行后台图片管理
7.绝大多数情况下,该免费额度都基本够用,并且可以稍微超出一点,不是已超出就立马停用,且每项额度单独计算,某项操作超出免费额度后只会停用该项操作,不影响其他的功能,即即便我的免费写入额度用完了,我的读写功能不受影响,图片能够正常加载,只是不能在图片管理后台看到新的图片了。
8.如果你的免费额度不够用,可以自行向 Cloudflare 购买 Cloudflare Workers 的付费版本,每月$5 起步,按量收费,没有上述额度限制
另外针对环境变量所做的更改将在下次部署时生效,如更改了环境变量,针对某项功能进行了开启或关闭,请记得重新部署。
共有 0 条评论