图文教程手把手教你使用Cloudflare搭建一个无限空间的私人图床-www.znnu.com
永至博客 | 专注编程与源码分享的技术站点
图文教程手把手教你使用Cloudflare搭建一个无限空间的私人图床

图文教程手把手教你使用Cloudflare搭建一个无限空间的私人图床

关于本项目

本项目是 Telegraph-Image 的重制版:

  • 这个项目为你提供了一个不限容量不限数量的图床 + cdn 服务
  • 图片存储在 telegraph 的服务器上 由 cloudflare 提供全球 cdn 服务
  • 基于 cloudflare pages 完全免费(现在 page 不限制额度了 和 worker 分开了)
  • 支持图片审查 API,可自动屏蔽不良图片
  • 可以自定义域名(也可以使用 cf 分配的 *.page.dev 但好像墙了 可以用其他 dns 的域名)获取域名可以看

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

  • 前后端全部开源 整体部署简单;
  • 添加了身份认证(解决了原项目的一个大问题,防止滥用);
  • 突破 5mb 的上传限制(超过了会自动压缩);
  • 流畅丝滑的过渡动画;
  • 多种上传方式(拖拽,选择文件,粘贴等);
  • 多样化复制方式(可直接复制 html,BBCode,MarkDown 语句);
  • 可以自定义页面,网站名称与 logo,满足更多自定义需求;
  • 增加了随机图 api;
  • 更多的欢迎大家自行探索

界面图

ed8b50dacf2304344bc66b4e7b7d82c

88922f053bd1971f32a099e0cac99cb

06c41a0ab9cf415eac73bfbff6d5252

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

开始之前,要先理解两个概念:

1.telegram 著名的通讯软件

2.telegraph 由 telegram 推出的匿名图片托管平台(现在不匿名了)

实操部署

部署此项目首先需要拥有

  1. GitHub 账号(点击跳转)
  2.  Cloudflare 账号(点击跳转)
  3.  Telegram 账号(点击跳转)

Telegram 配置

自 9.8 起 由于 Telegraph 图床被滥用 该项目上传渠道已切换至 Telegram Channel

这里需要获取到TG_BOT_TOKENTG_CHAT_ID这两个值 后续有用(必须的!!)

首先需要一个 Telegram 账号 软件直接去 Google Play 或者官网(t.me)下载即可

注册 telegram 后 可以安装这个简体中文包点此安装官方简体中文语言包(这是官方的 绝对安全)

这边我用电脑版做演示 手机版一样的

获取 TG_BOT_TOKEN

在搜索框中搜索 “@BotFather” 注意前面有个机器人的标志和后面的认证 千万别点错了!!!

a16918bf479bdcdc5e5e7035608398b

第一次使用点开对话后点击 “开始

896d51712a19bdb8482fa4819aa16f8

按图中进行配置

b0634baab2a753cb8d0aff7b2deee1a

获取 TG_CHAT_ID(频道 ID)

在 Telegram 中 打开左侧的二级菜单(三道杠) 打开新建频道(Manage Channel)

image

频道的名字随便起 后面都跳过就行

完成创建后 找到 “管理频道

image

在菜单中找到 “管理员(Administrators)

image

菜单中点击 “添加管理员

将刚才创建的机器人也设为管理员(注意搜索时要 @刚才设置的用户名 别填加错了)

image

权限默认的就可以

完成后首页搜索 “@VersaToolsBot

回复 /start 然后再你刚才创建的频道里随便发一条消息 并将消息转发到 @VersaToolsBot(如图)

image

在频道中发送的

image

刚才发的消息转发到 @VersaToolsBot

image

保留好这两个值,后面会用到

Cloudflare 配置

并且有一个域名 不需要必须绑定在Cloudflare中

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

image

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

image

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

image

点击上方的 “创建

image

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

image

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

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

bd4998e8561b8b079744f957ce0c994

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

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

f86a271aa7ed04945d960916e363261

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

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

image

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

image

点击 “创建命名空间

image

名称为 “img_url” 点击 “添加

image

完成添加后 回到 page 的界面 点击 “设置” 后点击 “变量与机密

image

找到 “绑定” 一栏 点击 “添加” 在弹出的页面中找到 “KV 命名空间

image

变量名称” 填写 “img_url

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

image

在绑定的上面找到 “变量与机密” 一栏 点击右侧的 “添加

添加 “环境变量

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

变量名称 解释 是否推荐
TG_CHAT_ID telegram 频道 ID 必须
TG_BOT_TOKEN telegram 机器人 token 创建的时候会返回一长串token 例:780*****82:AAHQs**************** 必须
BASIC_USER 后台管理的账户名 推荐
BASIC_PASS 后台管理的密码 推荐
AUTH_CODE 前台的认证码 强烈推荐 防止他人滥用
ModerateContentApiKey 图片审查 api 怎么用后面会讲到 这里是填获取的 api  
ALLOWED_DOMAINS 防盗链 访问域名限制
多个允许的域名用英文 , 分割,如:domain.com
没必要 反正流量无限的速度也不受影响 还可能造成自己的不便
AllowRandom 随机图 api 的前置 后面会讲到  
(还有关于界面自定义的变量 可以去 GitHub 看 个人不推荐界面大改 一是麻烦 二是还要动前端)

下面是我的配置(值里面填你实际的)这张图是早期的 不需要配置 tg 现在一定要部署 TG 的两个变量!!

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

1a7233c710b9af16e37e7d2880bffe5

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

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

image

等待部署完成后即可使用

内容审查API

打开 moderatecontent 官网(点击跳转)

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

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

随机图API

image

在设置好环境变量后访问 https://你的域名/random

© 版权声明
THE END
喜欢就支持一下吧
点赞10 分享
评论 抢沙发

请登录后发表评论

    暂无评论内容