修复【更新】Telegraph-Image免费自建图床新增后台图片管理…

46次阅读

共计 9089 个字符，预计需要花费 23 分钟才能阅读完成。

2023 年 1 月 19 日 1:51 AM 更新：之前发布的代码，由于熬夜精神状态不佳，写代码的时候犯了最低级的逻辑错误，本来应该是用 if（判断 如果设置了 kv 环境变量），则（图片首次加载时将图片写入 kv 储存当中），但是昨天也不知道大脑短路了还是怎么的，把 if 条件语句写反了，写成了 if（ 如果没有设置kv 环境变量），则（图片首次加载时将图片写入 kv 储存当中），但很明显如果没有设置 kv 环境变量，根本不可能成功写入 kv 储存成功，导致昨天部分大佬部署出现：Error 1101 Worker threw exception，设置了 kv 环境变量的大佬虽然程序能够正常运行，但是后台管理无法记录图片，因为程序不会执行写入操作。对此我感到非常抱歉，给各位大佬造成了困扰，现在问题应该是修复了，烦请各位大佬部署最新版本的代码，也感谢 @雾山 @mikj521 @那山很优雅 @3514088137 @hiing @telnetpig @mourner 等等大佬们的问题反馈，由于连续熬了几天夜，昨天身体已经实在顶不住了，所以睡觉去了，没能及时回复，抱歉！

之前随口一说 GIthub 上超过 500 Star 就更新图片管理功能，本来想的是一个小小的图床程序根本不可能达到 500 Star，但没想到各位大佬十分热情，好家伙，一下子没过几个月时间就给我点到 600+ Star 了。没办法既然是答应了的事情，只能是硬着头皮把图片管理功能写出来。

虽然在开发的过程中遇到了许多困难，花费的时间比我预想中的多了许多，发布的时间也是一拖再拖，在连续熬了几个夜晚之后，终于赶在春节之前发布这次的更新，也提前在此新春佳节即将来临之际祝各位大佬 春节快乐！在新的一年里能够实现自己心中的愿望！

废话不多说，直接上代码：
https://github.com/cf-pages/Telegraph-Image

之前没有部署过的大佬，直接 fork 本仓库就可以去 Cloudflare Pages 后台进行部署了。

下面就来介绍 本次更新的主要内容：

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

（如何创建 KV 储存空间，请参考：https://github.com/xyTom/Url-Shorten-Worker/#%E5%8E%BBworkers-kv%E4%B8%AD%E5%88%9B%E5%BB%BA%E4%B8%80%E4%B8%AA%E5%91%BD%E5%90%8D%E7%A9%BA%E9%97%B4）

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

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

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

3、新增图片总数量统计
当开启图片管理功能后，可在后台顶部查看记录中的图片数量

4、新增图片文件名搜索
当开启图片管理功能后，可在后台搜索框使用图片文件名称，快速搜索定位需要管理的图片

5、新增图片状态显示
当开启图片管理功能后，可在后台查看图片当前的状态{“ListType”: “None”, “TimeStamp”: 1673984678274}
ListType 代表图片当前是否在黑白名单当中，None 则表示既不在黑名单中也不在白名单中，White 表示在在白名单中，Block 表示在黑名单中，TimeStamp 为图片首次加载的时间戳，如开启的图片审查 API，则这里还会显示图片审查的结果用 Label 标识

6、新增黑名单功能
当开启图片管理功能后，可在后台手动为图片加入黑名单，加入黑名单的图片将无 ** 常加载

7、新增白名单功能
当开启图片管理功能后，可在后台手动为图片加入白名单，加入白名单的图片无论如何都会正常加载，可绕过图片审查 API 的结果

8、新增记录删除功能
当开启图片管理功能后，可在后台手动删除图片记录，即不再后台显示该图片，除非有人再次上传并加载该图片，注意由于图片储存在 telegraph 的服务器上，我们无法删除上传的原始图片，只能通过上述第 6 点的黑名单功能屏蔽图片的加载

9、新增程序运行模式：白名单模式
当开启图片管理功能后，除了默认模式外，这次更新还新增了一项新的运行模式，在该模式下，只有被添加进白名单的图片才会被加载，上传的图片需要审核通过后才能展示，最大程度的防止不良图片的加载，如需开启请设置环境变量：WhiteList_Mode==”true”

10、新增后台图片预览功能
当开启图片管理功能后，可在后台预览通过你的域名加载过的图片，点击图片可以进行放大，缩小，旋转等操作

这次的更新内容很多，可以算是重量级更新了，整个程序的后端代码几乎全部重写了一遍，也花了不少时间，希望各位大佬觉得好用的话，看在我连续熬夜肝了这么久的份上能否帮我在 Github 上点个免费的 Star，也可以帮我多多宣传一下，分享给更多的人，非常感谢！

已经部署了的，如何更新？
其实更新非常简单，只需要参照上面的更新内容，先进入到 Cloudflare Pages 后台，把需要使用的环境变量提前设置好并绑定上 KV 命名空间，然后去到 Github 你之前 fork 过的仓库依次选择“Sync fork”->”Update branch” 即可，稍等一会，Cloudflare Pages 那边检测到你的仓库更新了之后就会自动部署最新的代码了

一些注意事项：
Cloudflare KV 每天只有 1000 次的免费写入额度，每有一张新的图片加载都会占用该写入额度，如果超过该额度，图片管理后台将无法记录新加载的图片
每天最多 100,000 次免费读取操作，图片每加载一次都会占用该额度（在没有缓存的情况下，如果你的域名在 Cloudflare 开启了缓存，当缓存未命中时才会占用该额度），超过黑白名单等功能可能会失效
每天最多 1,000 次免费删除操作，每有一条图片记录都会占用该额度，超过将无法删除图片记录
每天最多 1,000 次免费列出操作，每打开或刷新一次后台 /admin 都会占用该额度，超过将进行后台图片管理

绝大多数情况下，该免费额度都基本够用，并且可以稍微超出一点，不是已超出就立马停用，且每项额度单独计算，某项操作超出免费额度后只会停用该项操作，不影响其他的功能，即即便我的免费写入额度用完了，我的读写功能不受影响，图片能够正常加载，只是不能在图片管理后台看到新的图片了。

如果你觉得免费额度实在不够用，可以自行向 Cloudflare 购买 Cloudflare Workers 的付费版本，每月 $5 起步，按量收费，没有上述额度限制（怎么感觉我在给 Cloudflare 打广告？Cloudflare 赶紧打钱，把广告费结一下 /doge 手动狗头）

上述注意事项所得出的结论是经过多天的反复测试得出的，基本应该是成立的，但不排除后期 Cloudflare 突然改变相关政策。其次，本次更新所发布的全部功能，都经过了多次的反复测试，如在使用过程中各位大佬遇到 bug，很有可能是 Cloudflare 或是浏览器缓存造成的，可以尝试先清除一下缓存再试，另外针对环境变量所做的更改将在下次部署时生效，如更改了环境变量，请记得重新部署。

如果尝试了清除缓存，重新部署还是有问题的话，可以在 github 上提 issue 反馈，毕竟这次更新的功能较多，然后我一个人的水平和时间都比较有限，虽然已经是做了反复测试，但还是很难说是把每一个功能，每一种情况都测试到，出现 bug 在所难免。能赶在新年之前发布，作为送给各位大佬的新年礼物，对于我个人来说已经是很不容易了，开发过程中遇到了许多困难，曾多次想要放弃，想直接鸽了算了，但是一想到有这么多大佬（600+ stars）在默默的支持我，在 Github 上给我点小星星，我就觉得不能辜负了各位大佬的好意，无论如何都要咬牙把图片管理功能更新出来。

网友回复：

注册：补充说明：变量名称是 img_url，不是 img url，注意有下划线

future：针对这个问题，可能我写的不是很清楚，现在补充说明一下：图片上传后不会立刻在后台显示出来，而是需要通过你的域名加载过该张图片才会记录下来，你可以试试上传图片后先手动访问一次图片，看看后台是否会有记录

future：可以开启白名单模式，限制图片加载，因为后端的图片储存是采用了 telegraph 图床，即便限制前台图片上传，别人也可以直接通过 telegraph 官方的服务上传图片，所以限制前台图片上传没有太多的必要，且用处也不是很大但你可以限制图片的加载，这样就能够最大程度保证域名安全，其次当你开启了图片加载限制，别人上传的图片无法进行加载也大概率不会继续使用你的域名上传图片了，因为如果只是用来上传图片的话别人完全可以直接部署一个属于自己的图床用于上传或使用官方的接口所以只只要限制了图片加载，开启白名单模式，目前来说已经基本够用了

future：昨天发布的代码有 bug，现在修复了，重新部署最新的代码应该就没问题了

future：目前在我测试的时候超出额度账号不会封，是否停止服务，超出不同的额度对应不同的结果，具体帖子里面有解释

future：之前 fork 的直接更新了，现在后台管理都有了，不过新传图，后台管理还是空的，kv 里也没记录

future：后续会考虑移植到支持 vps 环境，就暂定个小目标，star 数过 1000 吧，更新下一期，支持部署到小鸡上

acpp：补一张测试过程中超出 kv 免费使用额度的截图，仅供参考，如需长期超额使用，请购买付费套餐该截图是 Demo 图床所对应的 kv，目前该图床已超出免费的写入额度，目前无法在图片管理后台看到新加入的图片，但是不影响其他功能的使用，各位大佬可以自行访问 Demo 网站测试：https://im.gurl.eu.org

雾山：帮顶

future：绑定，之前提到没有后台管理，这次加上了，感谢分享

future：支持技术大佬

alecctv： mark

lspro： lz 的头像白夜行啊~

smu：不需要管理功能的话，有必要更新吗？

danielzi：感谢大佬

hiing：不错不错，我也去搞一个

一口：难得前排支持一下

注册：就差部署到小鸡上了

注册：牛逼, 可以搞一个文件床吗

莆田郑少斌：大佬牛逼，支持。不过更倾向于自建图床

iww：技术贴，牛逼牛逼

siyun77：补一张测试过程中超出 kv 免费使用额度的截图，仅供参考，如需长期超额使用，请购买付费套餐该截图是 Demo 图床所对应的 kv，目前该图床已超出免费的写入额度，目前无法在图片管理后台看到新加入的图片，但是不影响其他功能的使用，各位大佬可以自行访问 Demo 网站测试：https://im.gurl.eu.org

gyhl：后续会考虑移植到支持 vps 环境，就暂定个小目标，star 数过 1000 吧，更新下一期，支持部署到小鸡上

future：围观

future：支持，话说加个可以配合 picgo 一起使用的功能吗

Nassa： https://github.com/secflag/picgo-plugin-telegraph-image 可以看下这位大佬写的

lamb： NB,MJJ 太顶了

注册：牛

注册：之前 fork 的直接更新了，现在后台管理都有了，不过新传图，后台管理还是空的，kv 里也没记录

kekeguai：要图片首次访问过后才能被记录到

雾山： mark！

future：这个超过免费额度后会怎么样？直接不响应停止服务还是号有可能被封

Kuro：技术贴帮顶

acpp：大佬把创建 KV 储存空间说一下吧，跟着教程过不了，你放的哪个链接说的太模糊了，没有你自己写的好。

gajiodgaj：来个 vps 版的不就不用担心次数限制么吗？

imes：后排支持一下大佬！

晴空：上传图片后，后台不记录

注册：签名就是这个很好用

注册：先顶一下

机长：大佬后台访问提示 Dashboard is disabled. Please bind a KV namespace to use this feature. 是啥问题? 按照你写的教程操作的

telnetpig：大佬

mikj521：谢啦

鸡不择食：好

lamb：牛逼牛逼

b66667777：先顶为敬. 设置了 BASIC_PASS BASIC_USER, 域名 /admin 就直接进了 dashboard 了,, 没有要求输入密码, 浏览器开无痕模式也一样. 另外你文字说明绑定 kv 空间的变量名称是 img_url 图片里是 img url,, 中间是个空格, 不知哪个为准.

Aa.：大佬牛比

全局管理员： mark

注册：大赞

注册：上传的图片，访问过之后也没看到记录，不知道啥情况

cbm：绑定

那山很优雅：绑定

Zeros： make

不懂事的依旧：在配置下 CF 优选就完美了

SarK：直接白 **fork 星

3514088137：技术贴绑定

Ryen：一样，如果有解决方法麻烦告诉下

Mr.lin：技术贴支持下大佬

注册：具体的图片页面 Error 1101 是不是 telegram 的 API 坏掉了？

注册：顶，技术贴

hiing：出错了，打开上传的图片地址时显示：Error 1101 Worker threw exception

纯之：又更新了一版代码，昨天连续更新了几个版本，其中有个版本是有 bug 的，现在部署最新的代码试试，应该每问题了

telnetpig：测试黑名单

future：目前在我测试的时候超出额度账号不会封，是否停止服务，超出不同的额度对应不同的结果，具体帖子里面有解释

future：是 bug，现在修复了，部署最新的版本的代码就行了

future：绑定了 KV 空间后要记得重新部署一次代码，另外昨天发布的代码有 bug，现在更新了一版新的代码，部署一下最新的代码试试

acpp：图片显示有问题，cloudflare 的 bug，以文字说明为准，设置环境变量后记得要重新部署一次

future：大神的帖子必须要顶一下

注册：昨天发布的代码有 bug，目前修复了，现在按照帖子里的更新说明，部署最新一版的代码应该就能记录上了

注册： cf pages 原生支持 cname 接入，可以直接配置优选 ip，不需要绑卡开启 saas

future：昨天发布的代码有 bug，现在修复了，可以重新部署一下最新的代码试试

future：昨天发布的代码有 bug，现在修复了，重新部署最新的代码应该就没问题了

future：昨天发布的代码有 bug，部署一下最新的代码

future：正常了

future： 1101 目前正常了，不过添加 kv 后后台似乎还是没有记录（更新中说了修复，可能我没整好吧）—- 重试了一遍，已修复，一切正常，感谢楼主的努力

telnetpig：部署正常，感谢楼主。

Caxen： 1 月 19 日 4:35 AM 更新，优化代码逻辑，减少 KV 的写入数量，避免 KV 免费写入数量快速耗尽的情况，有需要的大佬可以更新到最新的版本

jnncc：可以不用更新，本次更新主要就是新增了管理功能，其他没有太大的改变，但其实更新也很方便，如果不启用管理功能的话，去 GitHub 上点几下鼠标就行了不需要管理功能的话，直接去到 Github 你之前 fork 过的仓库依次选择 Sync fork->Update branch 即可，稍等一会，Cloudflare Pages 那边检测到你的仓库更新了之后就会自动部署最新的代码了

注册：大佬辛苦，快去睡吧睡吧

注册：正常了，感谢大佬

huang1dede：后台可以看到记录了，期待大佬下一次更新，太牛了

雾山： mark，nb

那山很优雅：辛苦大佬，新年快乐

ziyo：功能很棒，感谢楼主。我部署后遇到一个问题，麻烦大佬们帮忙看下：部署后前台上传没问题，但是后台管理进不去，配置了 KV。请问你们咋设置的？

aeox：已 star, 争取早日实现破 1000 的小目标

hoopan：设置 kv 以后点击重新部署了吗？设置 kv 或是环境变量后要重新部署才能生效，这是 cloudflare 的限制

眷恋：重新部署可以了，感谢登录也设置好了，有个小疑问：前台上传图片目前没有权限限制，以后会增加吗？

future：请问下环境变量是这种格式吗？各种格式都重新部署了好几回都不生效

注册：可以了，辛苦辛苦。但是有新 bug 绑定自定义域名之后，使用自定义域名上传的图片，后台无法被记录

注册： Dashboard is disabled. Please bind a KV namespace to use this feature. 都湿了，后台还是不行

mourner：已经 OK 了感谢大佬

senwzz：可以开启白名单模式，限制图片加载，因为后端的图片储存是采用了 telegraph 图床，即便限制前台图片上传，别人也可以直接通过 telegraph 官方的服务上传图片，所以限制前台图片上传没有太多的必要，且用处也不是很大但你可以限制图片的加载，这样就能够最大程度保证域名安全，其次当你开启了图片加载限制，别人上传的图片无法进行加载也大概率不会继续使用你的域名上传图片了，因为如果只是用来上传图片的话别人完全可以直接部署一个属于自己的图床用于上传或使用官方的接口所以只只要限制了图片加载，开启白名单模式，目前来说已经基本够用了

mikj521： true 不需要加引号，用户名和密码不需要加 <>

future：点击重新部署试下？

future：检查一下 kv 名称有没有设置对? 是 img_url

future：试过了，还是不行，不知道为什么哈哈。就是使用自定义域名上传的图片，然后使用自定义域名去访问图片，无法被记录

future：但示例 Demo https://im.gurl.eu.org 也是绑定的自定义域名，貌似还是正常在记录，方便私发域名和账号吗，我去看下问题？kv 名称对了吗? 是 img_url 注意有下划线

mourner：技术大牛 An error occurred while synchronizing data with the server, please check the network connection Dashboard is disabled. Please bind a KV namespace to use this feature. — 已经 bind 了

注册：这个是最新的，重新部署后账号密码这两个生效了，但是白名单模式那个变量没有生效 QQ 截图 20230119133319.png (10.2 KB, 下载次数: 0) 2023-1-19 13:36 上传点击文件名下载附件

注册：生效了，打扰了

3514088137：牛逼牛逼，顶一下

3514088137：补充说明：变量名称是 img_url，不是 img url，注意有下划线

wange008：感谢分享！收藏

future：针对这个问题，可能我写的不是很清楚，现在补充说明一下：图片上传后不会立刻在后台显示出来，而是需要通过你的域名加载过该张图片才会记录下来，你可以试试上传图片后先手动访问一次图片，看看后台是否会有记录

JustBeHappy：确实如此,, 能否程序里改改, 上传完后当场显示小图, 就不用复制链接打开一次了

future：理论上完全可以通过修改前端代码实现，但前端代码不是我写的，是别的大佬提供的，所以我不太方便改。有前端大佬能帮忙修改的欢迎提交 pr 但多数情况下，图床的作用就是在帖子或文档里面插入图片，当帖子或文档被打开后就会自动触发加载操作，不需要特意说去复制链接打开一次了，顺其自然就好，因为上传了图片就肯定要被使用，图片一使用就会触发加载这个操作，然后就会被记录到 kv 中另外补充说明该设计该机制的原因是，为了能够记录到尽可能多的图片，具体来说：1、由于之前版本的程序没有后台图片管理记录功能，如果需要图片上传之后才记录的话，则无法追溯之前没有该功能前就上传了的图片，而通过加载图片记录，则只要之前的图片被加载则可以记录上之前上传的图片，可以看作是一种兼容以前的图片 2、程序所依赖的后端图片储存空间是 telegraph，telegraph 有官方的 API 接口可以上传图片，即图片不一定需要通过你部署的域名上传，故为了统计通过其他方式上传，但通过你的域名加载的图片，采取了这种方式。这样就能统计到不通过你域名上传，但通过你域名加载的图片

全局管理员：谢谢技术大佬的无私奉献~

future：期待移植到 VPS 上

注册：大佬，能否支持像 EasyImage 那样的多图一起上传？

注册：照着输入 kv 变量可是输入域名 /admin 还是回到主页会是什么问题？

SzeMeng76：可以使用白名单模式来限制图片的加载

torvalds：这一步错误咋办还是说下面二个参数需要填写？

future：不需要填写下面的参数，建议可以尝试换个浏览器（或开启浏览器无痕模式），或是换个 Cloudflare 账号试试

Agoni： CTRL+V 不能上传只能选择图片

future： @future 接口挂了

Agoni：我这边看，貌似还可以用，如果用的是 Demo 网站，有时候因为用的人太多，达到了 Cloudflare 的每日 Worker 免费额度会暂时出错，但过一天就好了，如果是自己搭建的话，一般很难达到 Cloudflare 的免费额度，但有时候 telegraph 服务器偶尔抽风也会出问题

机长：之前我就是用的 telegra.ph 做我网站的图床。。。但是会不间断的抽风。两三天总有那么两三个小时抽风。。迫不得已还是换了。。。不然真的挺好用。。。

注册：了解了，感谢大佬反馈，后续会考虑支持 cf 的 R2 储存