MyBlog-关于图床
图床
GitHub图床
首先你要有自己的 GitHub 账号,这里不再赘述。
创建一个仓库,用来存放上传的图片,注意类型要选择public公共访问,否则无法使用,这也是GitHub图床不好的地方,任何人都可以访问你的图床并一键打包带走所有图片
然后进入个人设置的中的开发者设置,选择个人访问令牌,创建一个访问token

最后会得到类似ghp_Z7EBbuzoFrVavVEDovTMFoka9YC5tP0TKg4d样式的token
进入piclist,按以下规则填写:
- 设定仓库名:就是你的 GitHub 名/仓库名,可以直接去仓库复制尾部url,注意不要有空格
- 设定分支名:写 master 就行
- 设定 Token:把刚刚生成的 token 填上
- 指定存储路径:写成 img/ ,以后的图片都会存在 img 文件夹下,也可以写成其他路径
- 设定自定义域名:这是固定的格式, jsdelivr加速: https://cdn.jsdelivr.net/gh/你的用户名/你的仓库名/master 不加速 :https://raw.githubusercontent.com/你的用户名/你的仓库名/master
Cloudflare图床
相关项目:https://github.com/zhuima/awesome-cloudflare
R2 是 Cloudflare 自家的对象存储服务,和其他对象存储相比,R2 不计算流量,只计算访问,因此对于大文件和小文件来说,访问一次的消耗都是一样的。
R2 免费有每月 10G 存储,100 万次 A 类操作,1000 万次 B 类操作,对于个人用户来说完全足够了
登录Cloudflare账号,点击R2对象存储,这里需要添加一个付款方式才能使用,支持信用卡或PayPal,添加完成后,点击 将R2订阅添加到我的帐户 即可。
实测支持国内银联信用卡,没有信用卡也可以用PayPal账户(可绑定普通银行卡) 只有当你使用量超过每月限额时,超额部分才会向收费。
兰空图床
Lsky Pro(也称:兰空图床),是一个基于PHP 8.0+和Laravel框架开发的云端相册程序。它允许用户上传、管理和分享图片,并提供了多种强大的功能。Lsky Pro支持多种第三方云储存服务,如AWS S3、阿里云OSS、腾讯云COS等,还提供了图片审核、水印、分享、商业化等多种功能。
兰空图床开源版(v2 版本)的最后一次重大代码提交主要集中在 2022 年至 2023 年初。
- GitHub 状态:目前 GitHub 上的开源仓库已处于 Maintenance Mode (维护模式)。
- 更新频率:目前官方基本不再更新新功能,仅偶尔针对严重的系统漏洞或 PHP 版本兼容性问题进行极小规模的补丁推送。
付费版:商业化运作,提供更强的功能和技术支持
开源版的token获取极其逆天,大多数人一进去根本不知道在说什么,网上搜的教程也极其繁琐,本文提供一个解题思路,使用Windows自带的powershell(win+x选择即可)
填写下面的内容,粘贴回车
$postParams = @{ email = "你的登录邮箱" password = "你的登录密码"}
Invoke-RestMethod -Uri "https://图床域名/api/v1/tokens" `-Method Post `-Headers @{"Accept"="application/json"} `-Body $postParams稍等片刻就会得到类似格式的内容:
status message data
------ ------- ----
True success @{token=1|QJ9JPyLfghvjbkjlkytresxcvbuooeaq3}
如何使用?
设定主机:你的图床域名
token填写:Bearer 1|QJ9JPyLfghvjbkjlkytresxcvbuooeaq3
注意:如果显示的是token=2或者其他数字,Bearer 1要改成Bearer 2或者其他数字
如何清空token?
输入任意token,你可以在powershell中输入下面的内容来清空所有token,为啥不能删除单个?因为没有这个功能
小知识:
在数据库(如 MySQL/PostgreSQL)中,每一个表通常都有一个叫 ID 的列。
- 自增逻辑: 当你创建第 1 个 Token 时,ID 是 1;创建第 2 个时,ID 是 2。
- 不可逆性: 当你删除了 ID 为 1 和 2 的记录后,数据库的计数器不会重置。它会记住“上一次最大的 ID 是 2”,因此新创建的记录必然从 3 开始。
- 目的: 这样做是为了保证 ID 的唯一性,防止旧的数据关联(比如日志文件里记录了 ID 2)错误地指向新的数据。
# --- 配置区 ---$baseUrl = "你的图床域名"$apiToken = "这里填入任意同账户Token"
# --- 执行区 ---$headers = @{ "Authorization" = "Bearer $apiToken" "Accept" = "application/json"}
try { $response = Invoke-RestMethod -Uri "$baseUrl/api/v1/tokens" -Method Delete -Headers $headers if ($response.status) { Write-Host "成功:当前 Token 已被清空!" -ForegroundColor Green } else { Write-Host "失败:$($response.message)" -ForegroundColor Red }} catch { Write-Host "请求出错,请检查域名或 Token 是否正确。" -ForegroundColor Red $_.Exception.Message}WEBP
WebP是一种同时提供了有损压缩与无损压缩的图片文件格式。 WebP最初在2010年9月发布,其支持库于2018年4月发布1.0版本。截至2021年5月,已有94%浏览器支持此格式。 WebP的设计目标是在减少文件容量同时,达到和JPEG、PNG、GIF格式相同的图片质量,并希望借此能够减少图片档在网络上的发送时间。
上传图片请优先考虑转换为webp再上传返回图链,或者通过 WebP Cloud 加速 (在线代理)
webp的优势
- 极高的压缩率:在同等画质下,WebP 的体积比 JPEG 小 25%~34%,比 PNG 小 26%。这意味着同样的图片,WebP 能让你的页面加载速度提升一大截。
- “全能型”选手:
- 支持透明度:它像 PNG 一样支持透明背景,但体积远小于 PNG。
- 支持动图:它像 GIF 一样支持动画,但压缩效率比 GIF 高得多,且支持全彩(GIF 仅支持 256 色)。
- SEO 友好:Google 非常看重页面加载速度。使用 WebP 能显著提升 Google PageSpeed Insights 的评分,从而间接提升搜索排名。
- 节省带宽/流量:如果你的博客访问量很大,或者托管在按流量计费的云服务(如阿里云、腾讯云对象存储)上,WebP 能帮你省下不少真金白银。
| 维度 | PicList 本地转换 (上传前转 WebP) | WebP Cloud 加速 (在线代理) |
|---|---|---|
| 工作原理 | 上传前通过本地插件(如 pic2webp)压缩,存入图床的就是 WebP。 | 原始图床存原图(JPG/PNG),通过 WebP Cloud 中转并实时转换。 |
| 原图保留 | 困难。上传后图床只有 WebP,想找原图得翻本地。 | 完美保留。图床存高清原图,访客看的是压缩后的 WebP。 |
| 灵活性 | 固定。一旦转换,质量、尺寸就定死了。 | 动态控制。可以通过 URL 参数实时加水印、改尺寸、加滤镜。 |
| 迁移成本 | 极低。图片直接在自己图床。 | 较高。依赖 WebP Cloud 服务,若停用需改回原图链接。 |
| 加载速度 | 取决于你图床的 CDN 速度。 | 通常更快,它自带边缘计算和全球 CDN 加速。 |
WebP Cloud 提供了一些 PicList 无法做到的动态功能:
- 智能回源: 它能根据访客的浏览器自动决定发 WebP 还是 AVIF(比 WebP 更高效)。如果访客是用上古浏览器,它会自动回退到 JPG。
- 即时处理: 比如你有一张 5MB 的原图,你可以在 URL 后面加个参数
?image_process=resize,w_500,它会立即在云端帮你生成一张 500 宽的小图。 - 保护原图: 你的图床链接可以不对外公开,只公开 WebP Cloud 提供的代理链接,有效防止原图被盗。
WebP Cloud 免费吗?
是的,它有免费额度,但有限制。
截至目前,WebP Cloud 的 Always Free 计划包含:
- 日循环额度: 3,000 次(对于普通博客绝对够用)。(通过签到可以获取一些永久的免费额度)
- 缓存限制: 200 MiB 缓存空间。
- 代理数量: 最多支持 3 个代理(即关联 3 个图床/源站)。
- 费用: $0。
- 注意: 如果你的日流量非常大,超过 3,000 次请求后,你可以设置“回退到原图”或者“显示占位图”。
适合用 PicList 转换的情况:
- 你对图片没有二次修改需求(不需要动态缩放)。
- 你希望图床文件越小越好(节省存储空间)。
- 你不想依赖第三方中间服务,追求极致的简洁。
适合用 WebP Cloud 的情况:
- 你想在博客里保留高清原图供下载,但展示时用压缩图。
- 你需要为不同设备(手机/电脑)提供不同尺寸的图片。
- 你的图床本身速度一般(如放在 GitHub 或 Backblaze 上),想白嫖它的全球加速。
那如果两个我都要呢?
一. 这种方案的实际效果
如果你先用 PicList 把 PNG/JPG 转成了 WebP 上传,再用 WebP Cloud 代理,会发生以下过程:
- 存储阶段: 你的图床里存的是已经压缩过的 WebP(体积已经变小,省了图床流量/空间)。
- 回源阶段: WebP Cloud 去你的图床抓取时,抓到的是 WebP。
- 二次处理: WebP Cloud 会发现这已经是 WebP 了,它通常不会再次进行有损压缩(除非你设置了更低的质量参数),但它会:
- 转化为 AVIF: 如果访客浏览器支持 AVIF(压缩率比 WebP 更高),WebP Cloud 会把你的 WebP 转成 AVIF 发给用户。
- 全球 CDN 缓存: 利用它的边缘节点加速图片加载。
二. 这么做的优缺点
优点 ✅
- 极致省流量: 你的图床回源给 WebP Cloud 时消耗的流量最小(因为回源的就是 WebP)。
- 兼容性无忧: 即使你本地转的 WebP 编码有问题,WebP Cloud 也会作为“中间人”确保输出最兼容的格式。
- 保留动态处理能力: 你依然可以通过在 URL 后面加参数(如
?image_process=resize,w_300)来实时生成缩略图,而不需要自己手动去切图。
缺点 ❌
- 画质潜在损耗: 虽然 WebP 是现代格式,但“本地压一次 + 云端处理一次”理论上存在极微小的画质劣化(通常肉眼不可见)。
- 失去了“后悔药”: 如果你先转成 WebP 上传,你就彻底丢掉了原图。万一未来出现了比 WebP/AVIF 更牛的格式,你无法再从高质量原图转换过去。
三. 性能与成本对比
| 方案 | 原始图床流量 | WebP Cloud 压力 | 终端用户体验 |
|---|---|---|---|
| 原图 + WebP Cloud | 较高 (回源大文件) | 转换压力大 (需处理大图) | 极好 (自动最优格式) |
| WebP + WebP Cloud | 极低 (回源小文件) | 转换压力小 | 极好 (自动转 AVIF) |
webp cloud的使用
首先通过 GitHub 或者谷歌授权登录 WebP Cloud 平台。
点击右下角创建代理
- 「代理名称」填写一个自定义名称即可
- 「源站地址」,以GitHub图床为例,填写:https://raw.githubusercontent.com/你的用户名/你的仓库名/master
然后你会获得一个地址,piclist填写到自定义域名即可使用
套娃
是的,你依旧可以考虑套娃
所谓的套娃逻辑是: GitHub (存储) -> jsDelivr (CDN 分发) -> WebP Cloud (格式转换/处理)
为什么要这么做?
- 减轻 WebP Cloud 的回源压力:如果你直接让 WebP Cloud 去 GitHub 取图,由于 GitHub 官网在海外且有时不稳定,可能会导致 WebP Cloud 转换超时。如果让它去 jsDelivr 取图(jsDelivr 有全球缓存),WebP Cloud 获取原图的速度会极快,渲染也就更快。
- 双重加速:利用了 jsDelivr 的分发能力和 WebP Cloud 的压缩能力。
如何配置套娃?
在 WebP Cloud 后台创建 Proxy 时:
- Origin URL: 填你的 jsDelivr 地址,例如:
https://cdn.jsdelivr.net/gh/你的用户名/你的仓库名/master - WebP Cloud 会给你一个新地址:
https://xxxx.webp.ee/
自动替换图链
1. 使用 Typora
Typora 完美支持 PicList,可以实现:粘贴图片即上传,或者一键转换整篇文章的图片。
-
配置步骤:
- 打开 Typora 的 偏好设置 (Preferences) -> 图像 (Image)。
- 在“插入图片时…”下拉框选择 上传图片 (Upload image)。
- 勾选 “对本地位置的图片应用上述规则” 和 “插入时自动转义特殊字符”。
- 上传服务选择
PicGo(app)或PicGo-Core。 - 点击“验证图片上传选项”,如果显示成功,以后直接把图粘贴进 Typora,它就会自动变成图床链接。

-
批量转换: 如果已经写好了一篇带本地图片的文章,点击菜单栏 格式 -> 图像 -> 上传所有本地图片,它会一次性全部替换。
(注:要完成上面的配置才行!!!否则只是把你的图片传到图床上,你还是要手动替换)
2. 使用 VS Code
VS Code 需要安装插件来对接 PicGo。
- 推荐插件:
vscode-picgo或VS-MDAllInPicGo。 - 操作方式:
- 自动上传: 安装插件后,在设置里关联你的 PicGo 配置。之后在编辑 Markdown 时,直接使用快捷键(通常是
Ctrl + Alt + U)就可以将剪贴板的图片上传并生成链接。 - 一键转换: 像
VS-MDAllInPicGo这类插件支持右键点击 Markdown 文件,选择 “Upload and replace local images”,它会自动扫描文中所有本地路径并替换为图床链接。
- 自动上传: 安装插件后,在设置里关联你的 PicGo 配置。之后在编辑 Markdown 时,直接使用快捷键(通常是
3. 使用 Obsidian
Obsidian 用户可以使用社区插件实现自动化。
- 推荐插件:
Image Auto Upload Plugin。 - 配置步骤:
- 在 Obsidian 插件市场搜索并安装
Image Auto Upload Plugin。 - 确保电脑上 PicGo 处于运行状态。
- 在插件设置中开启“自动上传”。
- 之后无论是拖拽图片还是粘贴图片进入 Obsidian,它都会通过 PicGo 上传并自动替换链接。
- 在 Obsidian 插件市场搜索并安装
支持与分享
如果这篇文章对你有帮助,欢迎分享给更多人或赞助支持!
凛w的后花园