保姆级教程免费搭建私有无限空间图床:基于 Cloudflare Pages 和 telegra.ph

那条鱼不洗澡 头像

0 评论

476 Views

2,514 字,阅读时间 12 分。


关于本项目

项目仓库(点击跳转)

前端仓库(点击跳转)

作者博客(点击跳转)

本项目是 Telegraph-Image 的重制版

这个项目为你提供了一个不限容量不限数量的图床 + cdn 服务

图片存储在 telegraph 的服务器上 由 cloudflare 提供全球 cdn 服务

基于 cloudflare pages 完全免费(现在 page 不限制额度了 和 worker 分开了)

支持图片审查 API,可自动屏蔽不良图片

可以自定义域名(也可以使用 cf 分配的 *.page.dev 但好像墙了 可以用其他 dns 的域名)获取域名可以看

该项目在原项目的基础上加以完善 特色功能如下

前后端全部开源 整体部署简单;

添加了身份认证(解决了原项目的一个大问题,防止滥用);

突破 5mb 的上传限制(超过了会自动压缩);

流畅丝滑的过渡动画;

多种上传方式(拖拽,选择文件,粘贴等);

多样化复制方式(可直接复制 html,BBCode,MarkDown 语句);

可以自定义页面,网站名称与 logo,满足更多自定义需求;

增加了随机图 api;

更多的欢迎大家自行探索

界面图

保姆级教程免费搭建私有无限空间图床:基于 Cloudflare Pages 和 telegra.ph_img_1
保姆级教程免费搭建私有无限空间图床:基于 Cloudflare Pages 和 telegra.ph_img_2
保姆级教程免费搭建私有无限空间图床:基于 Cloudflare Pages 和 telegra.ph_img_3
保姆级教程免费搭建私有无限空间图床:基于 Cloudflare Pages 和 telegra.ph_img_4

图床速度体验(点击跳转)

实操部署

部署此项目首先需要拥有一个 GitHub 账号(点击跳转)和一个 cloudflare 账号(点击跳转)

并且有一个域名 不需要必须绑定在 cf 中 没有的话可以看下面两篇

2024 可用的免费域名 us.kg!审核极快,可托管 cloudflare 手把手带你避开所有坑点! – yunsen2025 的小窝

2024 可用超低价顶级域名!可支付宝,绑定 cloudflare 第二年续费同价! – yunsen2025 的小窝

首先打开该项目仓库(点击跳转)点击 “Fork”(如果你认可此项目 可以点击旁边的 starts 以支持作者)

此页面不用动任何设置 直接点击 “Create fork” 即可

保姆级教程免费搭建私有无限空间图床:基于 Cloudflare Pages 和 telegra.ph_img_5

成功创建 fork 后来到 cloudflare 登录你的账号并打开仪表盘 点击侧边栏中的 “Workers 和 Pages

保姆级教程免费搭建私有无限空间图床:基于 Cloudflare Pages 和 telegra.ph_img_6

点击上方的 “创建

保姆级教程免费搭建私有无限空间图床:基于 Cloudflare Pages 和 telegra.ph_img_7

选到 “Pages” 一栏,点击 “连接到 Git

保姆级教程免费搭建私有无限空间图床:基于 Cloudflare Pages 和 telegra.ph_img_8

在打开的第一个页面 点击 “连接到 GitHub” 随后会跳转到 GitHub 进行授权 选到 “All repositories”(该选项是默认的 啥也不用动就好)

完成授权后会回到 cf 的选择存储库的界面(如下图),选择刚才 fork 的仓库后点击 “开始设置

保姆级教程免费搭建私有无限空间图床:基于 Cloudflare Pages 和 telegra.ph_img_9

下一个界面啥也不用动,直接划到下面点击 “保存并部署即可

出现下图即部署完成,点击 “继续处理项目

保姆级教程免费搭建私有无限空间图床:基于 Cloudflare Pages 和 telegra.ph_img_10

到此,最基本的已经部署好了,下面是设置认证码与后台管理的账号密码

点击 “自定义域” 添加一个你自己的域名(域名不是必须在 cf 中 在其他的 dns 中也行 但是还要额外配置比较麻烦)

点击左侧栏中的 “KV”(在 Workers 和 Pages 菜单下)

保姆级教程免费搭建私有无限空间图床:基于 Cloudflare Pages 和 telegra.ph_img_11

点击 “创建命名空间

保姆级教程免费搭建私有无限空间图床:基于 Cloudflare Pages 和 telegra.ph_img_12

名称为 “img_url” 点击 “添加

保姆级教程免费搭建私有无限空间图床:基于 Cloudflare Pages 和 telegra.ph_img_13

完成添加后 回到 page 的界面 点击 “设置” 后点击 “函数

保姆级教程免费搭建私有无限空间图床:基于 Cloudflare Pages 和 telegra.ph_img_14

划到下面找到 “KV 命名空间绑定” 点击 “添加绑定

保姆级教程免费搭建私有无限空间图床:基于 Cloudflare Pages 和 telegra.ph_img_15

变量名称” 填写 “img_url

KV 命名空间 “选择刚才创建的 KV “img_url” 完成后点击保存

保姆级教程免费搭建私有无限空间图床:基于 Cloudflare Pages 和 telegra.ph_img_16

在 “设置” 下找到 “环境变量

保姆级教程免费搭建私有无限空间图床:基于 Cloudflare Pages 和 telegra.ph_img_17

选择左侧的 “环境变量

在这里有些常用环境变量可以添加 如下表

变量名称作用是否推荐
BASIC_USER后台管理的账户名推荐
BASIC_PASS后台管理的密码推荐
AUTH_CODE前台的认证码强烈推荐 防止他人滥用
ModerateContentApiKey图片审查 api 怎么用后面会讲到 这里是填获取的 api 
ALLOWED_DOMAINS防盗链 访问域名限制
多个允许的域名用英文 , 分割,如:域名.com,域名2.top
没必要 反正流量无限的速度也不受影响 还可能造成自己的不便
AllowRandom随机图 api 的前置 后面会讲到 

(还有关于界面自定义的变量 可以去 GitHub 看 个人不推荐界面大改 一是麻烦 二是还要动前端)

下面是我的配置(值里面填你实际的)

(觉得比较敏感的可以点击右侧的加密 这里就单纯的是以后看不到值的内容了 没其他实际作用)

保姆级教程免费搭建私有无限空间图床:基于 Cloudflare Pages 和 telegra.ph_img_18

完成后点击保存 然后重新部署(所有关于环境变量的修改都要重新部署一遍)

选到 “部署” 一栏 在 “所有部署” 下面找到你最新的部署(就是最上面的那一个),鼠标点击在右侧三个点 在弹出的菜单中选择 “重新部署

保姆级教程免费搭建私有无限空间图床:基于 Cloudflare Pages 和 telegra.ph_img_19

等待部署完成后即可使用

内容审查 api

最近不知道官网怎么了 没有注册入口了 直接进以前的注册入口 moderatecontent.com/signin 会报 500 错误,不知道是跑路了还是服务器崩了 最近暂时用不了 需要的还是设前台认证码吧

打开 moderatecontent 官网(点击跳转)

注册账号后获取到你的 api 在环境变量中添加一条 “ModerateContentApiKey” 值就是你获取的 api

保存后别忘了重新部署一遍

随机图 api

保姆级教程免费搭建私有无限空间图床:基于 Cloudflare Pages 和 telegra.ph_img_20

在设置好环境变量后访问 https://your.domain/random