使用OSS为个人博客搭建图床

需求

原先我的个人博客使用图片的解决方案是将图片直接放在博客路径下,用rsync将博文和图片同步到服务器,就可以正常访问。插入时,在Typora中配置使用相对路径即可。

然而这种方案不是特别优雅,以及不便于笔记日后发表到其它站点。于是个人博客重新搭建后,准备使用图床来解决图片上传的问题。另一方面也是想尝试一下久闻其名的图床。

方案选择

根据会飞的猫博客[1]中各方案的对比,主要有基于Github的和基于OSS的,前者需要公开图床,于是我选择后者。后者中,又可以选择是否使用自己的域名,以及是否用CDN等,最终我选择成本较低、风险较低、可迁移的方案,即使用OSS+个人域名搭建图床,并通过使用与服务器处在同一内网的OSS来实现免外网流量收费,避免被盗刷流量的损失。

盗刷流量是指,OSS图床开放公共读权限,而OSS本身不具备限制流量的功能,因此任何人都可以通过公开链接疯狂请求OSS图片,导致OSS拥有者面临巨额流量账单。如果不使用同一内网的OSS,为以防万一可以使用CDN包装一层,CDN一般带有流量监测功能。

方案原理

图片存储在OSS,通过其提供的域名可以访问到图片。随后通过将个人域名转发到OSS域名,实现后期可方便地换OSS。最后,使用Typora+PicGO实现写博客时粘贴一张图片就自动上传到OSS,并在文章中生成对应链接。

优点:隐私性好,避免盗刷,易于迁移。

缺点:占用服务器带宽,我的服务器是3Mbps,多人同时访问可能会寄(不过应该不会有这种情况)。

OSS收费情况

因此直接考虑阿里云OSS,而没有考虑其它OSS(其实还有很多选项,搭建完后才了解到比如七牛云比阿里云OSS便宜20%~50%,且每月有10G存储、10GCDN回源和100万次GET请求的免费额度,有机会可以转到七牛云)。此外,阿里云新用户有3个月OSS试用,记得薅羊毛。

这里先以阿里云为例,介绍一下OSS的收费组成,一般由存储费用、流量费用、请求费用等组成。选择不一样的OSS类型会导致单价不同,如标准型、低频访问型、归档型、冷归档型,这里我们博客用的是标准型。(具体价格截止至本文完成的时间,参考官网

  • 存储费用是指数据自从存在OSS中就产生的费用。分本地冗余存储(0.12元/GB/月)和同城冗余存储(0.15元/GB/月),前者数据冗余在某个特定的可用区内,当其所属可用区不可用时,会导致相关数据不可访问,对于个人博客而言使用本地冗余即可。
  • 流量费用包括若干,其中内网流量免费,外网流入免费,流出(比如用户访问博客,下载OSS中的图片)收费,标准型是00:00 - 08:00(闲时):0.25 元/GB,08:00 - 24:00(忙时):0.50 元/GB。
  • 请求费用就是API费用,比如通过PicGO上传图片,下载图片等。有Put、Get等请求类型。Put类型请求包括数据上传、拷贝、删除等操作,一般是博主操作图床;Get请求在用户访问时会用到。二者价格基本都是0.01元/万次。

收费案例(参考阿里云官网

李先生计划于2024年10月使用OSS在华东1(杭州)地域创建一个Bucket来托管静态网站。该Bucket中预计存放约505GB的数据,这些数据主要由HTML、CSS、JavaScript等类型的文件组成,并且选择了标准存储(同城冗余)类型进行存储。考虑到用户访问模式,李先生预估每天从早上8点到晚上12点之间,其网站平均每小时会收到大约1000次GET请求;此外,在这个时间段内,由于用户浏览网页或下载资源等原因,预计每天会有大约5 GB的数据流量从OSS流向客户端。其本月支付总费用约为151.47元,计费明细如下:

操作 涉及计费项 计费项Code 单价 计费量 费用
存储了505 GB标准存储(本地冗余)类型文件 标准存储(同城冗余)容量 StorageZRS 0.12元/GB/月 505GB/月 75.75元
每小时平均产生1000次GET类请求 Get类型请求次数 GetRequest 0.01元/万次 1000次/小时×24小时×30天 0.72元
每天8:00~24:00时间段内外网流出流量约为5 GB 外网流出流量 NetworkOut 0.50元/GB 5GB/天×30天 75元

可见对于本方案,费用只包括存储费用、请求费用,没有外网流出费用,图片存储不多的情况下每个月只需几块钱的样子。

步骤

需要分别建立图片下载通路(OSS -> Blog)和图片上传通路(Typora -> PicGo -> OSS)。

图片下载通路

  1. 开通OSS服务,创建Bucket。

    • 开通后在Bucket列表创建一个Bucket,这里选择标准存储、本地冗余存储。由于我们希望使用与服务器位于同一内网的Bucket,因此这里要选择与服务器相同的区域(机房)。
  2. OSS设置私有,并放行指定内网ip。

    • 默认为私有
    • 在【权限控制】——【Bucket授权策略】中,新增一个授权,这个功能只能放行内网IP。因此我们需要得到服务器的内网IP(可以在控制台查,也可以ipconfig),然后填写在这里。
    • image-20250116234431582
  3. 将自己的域名和OSS服务域名绑定。这一步是为了后续便于迁移。

    • 方式一:服务器nginx配置转发(proxy_pass)

    •   server {
                listen       443 ssl;
                server_name  imgbed-mf.mfqwq.cn;
        
                ssl_certificate mfqwq.cn_bundle.crt;
                ssl_certificate_key mfqwq.cn.key;
        
                location / {
                    proxy_pass https://imgbed-mf.oss-cn-beijing-internal.aliyuncs.com;
                    proxy_set_header Host $proxy_host;
                    proxy_set_header X-Real-IP $remote_addr;
                    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
                }
            }
        }
      
    • 方式二:这一步也可以直接通过添加DNS解析来实现。比如在DNS控制台添加一条主机记录为imgbed-mf,记录值为imgbed-mf.oss-cn-beijing-internal.aliyuncs.com的CNAME解析记录。或者通过OSS自带的【Bucket配置】——【域名管理】——【绑定域名】来实现,在这里设置之后,如果是阿里云的DNS解析,会自动生成一条上述的CNAME解析。

    • image-20250116232737346

    • 注意这里要使用带internal的链接(内网访问链接),外网访问链接(imgbed-mf.oss-cn-beijing.aliyuncs.com)访问不了,这是因为我们已经设置了私有,即便已经放行了白名单IP,也会报错You have no right to access this object because of bucket acl

图片上传通路

  1. 安装PicGo并配置。
    • PicGo官网写得很详细。注意存储空间名是Bucket的短名,而不是带oss-beijing这种的,以及存储路径如果指定的话需要以/结尾。值得吐槽的一点是,设置好点击确定后,PicGo软件并没有任何反应,导致我以为设置失败。
  2. 安装Typora并配置。
    • image-20250116230716228
    • 如上图,主要是设置自动上传图片和设置PicGo路径。
  3. 测试成功。
    • 在Typora中粘贴一张图片,会发现图片的地址变成设置的地址,将博客部署到服务器后,发现可以访问。

参考链接


使用OSS为个人博客搭建图床
https://mfqwq.cn/2025/01/16/picture-bed-oss/
作者
murphyqwq
发布于
2025年1月16日
许可协议