图片CDN自建方案:从零到一部署免费高速图床

UID:3 一级用户组

花钱买流量不如自己建------用免费资源搭建专业级图片CDN,一个月省下一杯奶茶钱

一、为什么要自建图床?

很多博主、开发者都在纠结图床的事:免费的怕跑路、怕限速;付费的又觉得小网站不值当。

其实,利用现有免费资源完全可以搭建一套稳定、快速的个人图床。这篇文章帮你把几种主流方案整理好,自己挑一个合适的就行。

痛点 免费图床的问题 自建方案能解决
图片加载慢 服务器在国外,国内打开要好几秒 CDN加速,国内秒开
担心跑路 小站说关就关,图片全没 数据在自己GitHub账号里,跑不了
管理麻烦 上传后找不到原图 通过Git管理,版本可控
有广告/水印 免费服务往往带品牌标识 完全自主,干净清爽

二、三种主流方案速览

在开始之前,先快速了解各方案的特点:

方案 成本 适合人群 优点 局限性
GitHub + jsDelivr CDN 0元 个人博客、开发者 完全免费,无需服务器 单文件≤100MB
Cloudflare + 云存储 0元起步 有自定义域名需求 可绑域名,HTTPS免费 需熟悉DNS配置
自建服务器 + Cloudflare 服务器成本 对数据安全要求高 完全掌控数据 需维护服务器

预算0元,直接选方案一:GitHub仓库存图片,jsDelivr做CDN加速。这是目前最成熟、最省事的组合。

三、方案一:GitHub + jsDelivr 免费CDN图床(零成本,推荐)

这是目前最流行的个人图床方案------GitHub仓库存图片,jsDelivr全球CDN免费加速,再配上PicGo一键上传。

3.1 架构图解

text

你上传图片 → PicGo工具 → GitHub仓库(存储)                               ↓                          jsDelivr CDN(全球加速)                               ↓                       用户访问:cdn.jsdelivr.net/gh/你的图片 

3.2 第一步:创建GitHub仓库

  1. 登录 GitHub,点击右上角 +New repository

  2. 仓库名填 image-bedmy-images(自己记得住就行)

  3. 关键:仓库权限必须选 Public(公开),否则CDN无法读取

  4. 勾选 Add a README file,点击 Create repository

3.3 第二步:生成GitHub Token

PicGo需要Token才能往你的仓库传图片:

  1. 点击右上角头像 → Settings → 拉到最下面 Developer settings

  2. 左侧菜单选 Personal access tokensTokens (classic)Generate new token (classic)

  3. 随便起个名字,比如 picgo-upload

  4. 权限勾选 repo(完整仓库权限)

  5. 拉到最下面点 Generate token

  6. 复制并保存这个Token! 只显示一次,丢了得重新生成

3.4 第三步:安装配置PicGo

PicGo是图片上传工具,支持Windows/Mac/Linux。

  1. 访问 PicGo官网 下载对应版本安装

  2. 打开PicGo,左侧菜单选 图床设置GitHub图床

  3. 填写以下信息:

配置项 填写内容
设定仓库名 你的GitHub用户名/仓库名(如 zhangsan/image-bed
设定分支名 main(GitHub默认主分支)
设定Token 粘贴上一步生成的Token
指定存储路径 images/(可选,图片将存在仓库的images文件夹下)
设定自定义域名 https://cdn.jsdelivr.net/gh/你的用户名/仓库名@main

注意:自定义域名这一项是CDN加速的关键!填写后上传的图片会自动生成CDN链接。

  1. 点击 确定,再点 设为默认图床

3.5 第四步:测试上传

  1. 切换到PicGo的 上传区 选项卡

  2. 拖一张图片进去,或点击上传区域选择图片

  3. 上传成功后,右下角会弹出提示,链接已自动复制到剪贴板

  4. 粘贴出来,链接格式应该类似:

    text

    https://cdn.jsdelivr.net/gh/zhangsan/image-bed@main/images/2024/example.png 
  5. 在浏览器打开这个链接,能正常显示图片就成功了

3.6 日常使用

  • 写博客时:直接用PicGo上传,粘贴链接就行

  • 配合Typora:Typora支持PicGo集成,截图后直接Ctrl+V粘贴,自动上传

  • 批量处理:PicGo支持多文件同时上传

四、方案二:Cloudflare + 云存储(可绑自定义域名)

如果你有自己的域名,想用 img.yourdomain.com 这样的地址,选这个方案。

4.1 架构图解

text

图片 → 云存储(OSS/S3) → Cloudflare CDN → 用户访问自定义域名 

4.2 云存储选哪个?(选免费额度大的)

服务商 免费额度 注意事项
Cloudflare R2 10GB存储 + 每月1000万次操作 无需流量费,推荐
AWS S3 5GB存储 + 12个月免费 超出需付费
腾讯云COS 10GB存储 + 10GB流量/月 6个月免费体验
阿里云OSS 5GB存储 + 5GB流量/月 3个月免费

推荐选Cloudflare R2:没有流量费,国内访问通过Cloudflare CDN加速,对个人站长最友好。

4.3 配置步骤

第一步:创建存储桶(以Cloudflare R2为例)

  1. 登录Cloudflare控制台,左侧菜单选 R2

  2. 点击 创建存储桶,命名如 my-images

  3. 权限设置:允许公共访问(Public)

  4. 创建完成后,在设置中绑定一个子域名(如 images.yourdomain.com

第二步:配置自定义域名CDN

  1. 在Cloudflare控制台,选择你的域名

  2. 进入 DNS 设置,添加CNAME记录:

    • 名称:images

    • 目标:R2给你的公开访问地址

    • 代理状态:开启(橙色云朵)

  3. 等待DNS生效,访问 https://images.yourdomain.com 即可

第三步:开启防盗链(可选但推荐)

在Cloudflare的 安全WAF 中添加规则,只允许你自己的网站引用图片:

text

(not http.referer contains "yourdomain.com") 

这样别人不能直接盗用你的图片链接。

五、方案三:自建服务器 + Cloudflare(完全掌控)

如果你已经有一台VPS,想完全掌控自己的图片数据,可以拿它当图床,再用Cloudflare做CDN加速。

5.1 适合场景

  • 你已经有VPS,不想额外折腾

  • 图片量大(超100GB),GitHub存不下

  • 对数据隐私有更高要求

5.2 架构设计

text

Nginx托管图片目录 → Cloudflare CDN加速 → 用户访问 

5.3 部署步骤

第一步:在服务器上创建图片目录

bash

mkdir -p /var/www/images # 放一张测试图片进去 cp ~/test.png /var/www/images/ 

第二步:配置Nginx

nginx

server {     listen 80;     server_name images.yourdomain.com;          # 图片缓存30天     location ~* \\.(jpg|jpeg|png|gif|webp)$ {         root /var/www/images;         expires 30d;         add_header Cache-Control "public, immutable";     } } 

第三步:接入Cloudflare

  1. images.yourdomain.com 的DNS托管到Cloudflare

  2. 开启代理模式(橙色云朵)

  3. SSL/TLS 中开启 完全(严格) 加密模式

  4. 系统会自动签发免费SSL证书

5.4 上传工具推荐

可以用 rsync 命令上传:

bash

rsync -avz /本地图片目录/ root@服务器IP:/var/www/images/ 

或用 FileBrowser 这类Web文件管理器,浏览器里直接上传。

六、各方案对比总结

对比项 GitHub+jsDelivr Cloudflare+云存储 自建VPS+CDN
费用 0元 0元起 服务器成本
存储上限 100GB/仓库 10GB免费 VPS硬盘大小
CDN速度 快(全球节点) 快(Cloudflare) 取决于Cloudflare
自定义域名 不支持 支持 支持
是否需要服务器
配置难度 :star: 简单 :star::star: 中等 :star::star::star: 较难
适合人群 个人博客、开发者 有域名的个人站长 已有VPS的技术用户

七、常见问题

Q1:jsDelivr在国内快吗?

快。jsDelivr有国内节点(网宿加速),国内访问速度通常在200ms以内,比GitHub原生raw链接快3-5倍。

Q2:上传后图片不更新怎么办?

CDN有缓存。在URL后面加时间戳强制刷新:

text

https://cdn.jsdelivr.net/gh/.../image.png?v=20240101 

Q3:GitHub仓库满了怎么办?

单个仓库100GB上限。满了就再创建一个新仓库,在PicGo里切换就行。

Q4:图片会被删吗?

只要你GitHub账号在,图片就在。jsDelivr只是CDN加速,不存你的原图。建议定期把整个仓库克隆到本地备份。

Q5:jsDelivr会不会挂?

这是全球最大的开源CDN,GitHub、npm、WordPress都在用,稳定性有保障。万一真有极端情况,PicGo里换一下自定义域名就能切到备用CDN。

八、写在最后

个人图床这件事,丰俭由人。

如果你是新手、不想折腾:照着方案一操作,30分钟就能用上免费CDN图床。这是目前验证过最稳定的方案。

如果你有自己的域名:方案二可以让你用 img.你的域名.com 这样的地址,看起来更专业。

如果你已经有服务器在跑:方案三不增加额外成本,顺便把图片服务搭起来。

无论选哪个,核心思路都一样:存和取分离,存的地方要稳定,取的地方要快。希望这篇指南能帮到你。

最新回复

请先登录后再回复 登录

uid:3 一级用户组
关注
发帖 25
评论 25
粉丝 0
关注 0
发新帖
目录
图片CDN自建方案:从零到一部署免费高速图床