结论: 当前博客优先采用腾讯 COS + PicGo;其他服务保留为方案对比,不建议同时维护多套上传链路。
安全要求: 文中的 AccessKey、SecretKey 和 Token 只能使用占位符,真实密钥不得写入文章、截图或 Git 历史。

一、图床

1、图床是什么

中文名: 图床

功能: 专门储存图片的空间

国内图床: 单线空间,多线空间,cdn加速

图床种类: 国内和国外,有空间距离的因素

外文名: Image Hosting Service

类型: 云存储、PaaS、自建型、社交型

2、为什么要搭建图床

(不能把图片直接放在服务器里面吗)

由于服务器的空间有限,而cos提供的图片存储空间大,可以存储更多的图片,而且cos可以提供更快速、稳定的服务,这样可以更好地满足用户的需求。

cos概念指的是存储对象服务,是针对对象存储的抽象层,能提供安全的、可扩展的、高可用的对象存储服务,可以支持海量的数据存储。

服务器是一台提供网络服务的计算机,可以承载网站、应用程序等服务,也可以为客户端提供数据访问、文件服务等功能。

二. 选择合适的图床服务

  1. 云存储型图床:像七牛云、阿里云OSS、腾讯云等都是云存储型图床,可以将图片直接上传至云端,可靠性高,容量大,易于管理。
  2. PaaS型图床:如imgur、sm.ms、postimages等,这些图床大多是免费的,但容量有限,有些可能会限制上传速度和图片大小,适合个人或小型网站使用。
  3. 自建型图床:自建型图床需要自己购买服务器、域名等,相对来说比较麻烦,但是可以满足自己的个性化需求,而且不受限于容量和速度等问题。
  4. 社交型图床:如微博、QQ空间、豆瓣等,这些社交平台都提供了图片上传功能,可以将图片分享给好友或发布到社交平台上。

三. 注册账号并获取API密钥

1 、配置:服务器设置(1.阿里云;2.腾讯云;3.smms;4.其他)

1. 配置阿里云

阿里云安全稳定,是国内首屈一指的云服务供应商。阿里云配置较复杂,如果不喜欢复杂操作,可直接跳过阿里云配置这部分,smms配置最为简单且免费,其中,阿里云、腾讯云服务器需收费,阿里云40G存储空间半年仅需4.98元,外网下载\读取流量0.12 元/GB/月,腾讯也差不多也这个价,海星吧!

1.1. 注册阿里云账号

阿里云链接如下:

1
https://www.aliyun.com/

支付宝绑定注册即可,注册后完成实名认证,新人可获得一项云服务免费体验一个月。

1.2. 开通对象存储OSS服务并创建bucket

注册成功后,右上角点击进入 “控制台” ,在控制台左上角菜单栏选择 “对象存储OSS” ,并开通该服务。

PicGo 图床配置步骤 01

点击左侧 “概览” ,再点击右侧 “创建bucket” ,如图:

PicGo 图床配置步骤 02

按要求填写 “Bucket名称” ,“区域” 可任意选择,其他选项均可不改动,唯一需要改动的是 “读写权限” ,一定要改成 “公共读” ,复制保存一下 “Bucket名称” 和节点 “Endpoint” 信息,之后点击 “确定”。

PicGo 图床配置步骤 03

1.3. 购买存储资源包

点击左上角菜单,进入 “资源包管理” ,点击 ”购买资源包“ ,新人可免费领取一个月的100G标准存储包,此外半年的40G存储包也仅需4.98元!

PicGo 图床配置步骤 04

PicGo 图床配置步骤 05

1.4. AccessKey 管理

点击右上角头像,进入 ”AcessKey管理“ ,安全起见,点击 ”开始使用子用户AcessKey“ :

PicGo 图床配置步骤 06

PicGo 图床配置步骤 07

创建子用户账户登录和显示名称(随便取即可),最后勾选 ”编程访问“ ,点击 "确认"

PicGo 图床配置步骤 08

创建完用户后出现用户信息页面,该页面关闭后将无法再次获取相关信息,一定要保存好 “AcessKey ID” 和 ”AcessKey Secret“ ,在配置文件中会用到,可以下载CSV文件保存信息。

PicGo 图床配置步骤 09

保存好相关信息后,点击 ”添加权限“ ,为该子用户添加访问权限,在搜索栏输入 ”oss" ,搜索所有关于 “对象存储oss” 的权限,一共两个,全部选中即可,右侧可看到当前已选择权限。

PicGo 图床配置步骤 10

1.5. 创建配置文件模板

复制以下配置代码到记事本备用,其中 “xxxx” 需要替换,每个人均不一样,其他可不改动。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
{
"picBed": {
"uploader": "aliyun",
"aliyun": {
"accessKeyId": "xxxx",
"accessKeySecret": "xxxx",
"bucket": "xxxx",
"area": "xxxx",
"path": "img/",
"customUrl": "xxxx",
"options": ""
}
},
"picgoPlugins": {}
}

其中,“acesskeyId" 和 “acesskeySecret” 即为 “1.4. AcessKey管理” 中保存的用户信息;

PicGo 图床配置步骤 11

其中, ”bucket“ 和 “area” 即为 ”1.2. 创建bucket“ 中保存的 ”Bucket名称“ 和节点 ”Endpoint" 信息,节点信息只需要取到前面的区域信息,后面的 “.http://aliyuncs.com” 删掉,以此处为例,“area” 对应为 “oss-cn-chengdu" 。

PicGo 图床配置步骤 12

最后, “customUrl” 为外网访问链接,格式为:“http://" + “Bucket名称” + ”Endpoint“ ,此处最终的 ”customUrl“ 为:

1
http://typroa-test.oss-cn-chengdu.aliyuncs.com

customUrl” 也可以从 “Bucket列表” 中直接获得,只需点击已创建的bucket将其展开就能获得外网访问链接。

PicGo 图床配置步骤 13

1.6. Typora配置文件

将之前记事本中的配置信息填好,就准备好了 ”Typora“ 中 ”PicGo-Core" 的配置文件,这里给出一份配置文件参考,密钥内容隐去一部分。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
{
"picBed": {
"uploader": "aliyun",
"aliyun": {
"accessKeyId": "LTAI4GJx2DGB1xxxxxxxx",
"accessKeySecret": "Ep6ynvPCG6bhEQPrCBksxxxxxxx",
"bucket": "typroa-test",
"area": "oss-cn-chengdu",
"path": "img/",
"customUrl": "http://typroa-test.oss-cn-chengdu.aliyuncs.com",
"options": ""
}
},
"picgoPlugins": {}
}

打开 “Typora" 依次打开 ”文件 ----> 偏好 ----> 图像“ ,点击 ”打开配置文件“ ,将上面的配置代码完整复制到配置文件中,”Ctrl+S" 保存后关闭配置文件。

PicGo 图床配置步骤 14

1.7. 大功告成!

最后,在 “打开配置文件”左侧 有个 “上传服务” ,点击 “验证图片上传选项” ,提示 “验证成功” ,则大功告成!

PicGo 图床配置步骤 15


2. 配置腾讯云

腾讯云配置与阿里云大同小异,基本流程都差不多。

2.1. 注册腾讯云账号

腾讯云链接如下:

1
https://cloud.tencent.com/

用微信或QQ均可登录,注册后首先完成实名认证。

2.2. 开通对象存储COS并创建存储桶

点击 “云产品” ,在下拉菜单中找到 “对象存储” ,点击后开通该服务;

PicGo 图床配置步骤 16

然后 “创建存储桶” ,其中 “访问权限” 一定要选择 “公有读私有写” ,“存储桶标签” 随便添几个就行;

PicGo 图床配置步骤 17

PicGo 图床配置步骤 18

2.3. 购买对象存储(COS)资源包

新手免费赠送了6个月50G标准存储容量,此外格外购买6个月10G标准存储包也只要4.96元。

PicGo 图床配置步骤 19

2.4. 密钥管理

进入 “控制台” — “访问管理” ,然后点击 “API密钥管理” — “切换使用子账号密钥” 。

PicGo 图床配置步骤 20

PicGo 图床配置步骤 21

点击 “快速创建” ,快速创建子账号,创建完毕后,点击进入左侧 “用户列表”,点击创建好的子账户用户名,进入用户详情页。

PicGo 图床配置步骤 22

PicGo 图床配置步骤 23

PicGo 图床配置步骤 24

在用户详情页中找到 “API密钥” 选项卡,点击 “新建密钥” ,几秒钟后生成密钥 “Secretid" 和 “SecretKey” ,复制保存以备用。

PicGo 图床配置步骤 25

2.5. 配置文件

腾讯云的配置文件如下:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
{
"picBed": {
"uploader": "tcyun",
"tcyun": {
"secretId": "AKIDCBvVor9u85lFZcwuYx5xxxxxxxxxx",
"secretKey": "RenmX1IJ3YoGTRAlzwc3eyxxxxxxxxxx",
"bucket": "typora-1302184631",
"appId": "1302184631",
"area": "ap-chengdu",
"path": "img/",
"customUrl": "https://typora-1302184631.cos.ap-chengdu.myqcloud.com",
"version": "v5"
}
},
"picgoPlugins": {}
}

其中 “secretId” 和 “secretKey” 即为 ”2.4. 密钥管理“ 中获得的密钥。

剩余信息在 ”云产品“ — ”对象存储“ — ”存储桶列表“ 中,

PicGo 图床配置步骤 26

PicGo 图床配置步骤 27

点击存储桶名,选择 ”基础配置“ 选项卡,右侧 ”基本信息“ 中包含配置文件中剩余所需信息。

PicGo 图床配置步骤 28

配置文件中,”bucket“ 对应 ”空间名称“ ;“appId” 对应 ”空间名称“ 后面的数字;”area“ 对应 ”所属地域“ 后面括号中的英文;”customUrl" 对应 “访问域名”。

2.6. 大功告成

打开 Typora 设置文件,将上面的配置文件代码完整复制进去,保存后关闭配置文件,最后

点击 “验证图片上传选项” ,提示验证成功,则大功告成!

PicGo 图床配置步骤 29

PicGo 图床配置步骤 30


3. 配置smms

smms" 简单实用,可快速上手,而且免费,由于服务器在国外,不一定稳定。

3.1. 注册smms账号

smms账号注册链接如下:

1
https://sm.ms/home/apitoken

3.2. 生成 Secret Token

注册完成后,再次复制该链接打开如下界面:

PicGo 图床配置步骤 31

点击 “Generate Secret Token" 生成 ”Secret Token" ,复制以备用。

3.3. 配置文件

打开 “Typora” 配置文件,将以下方代码复制到配置文件,其中 ”token" 即为上面图片中的 “Secret Token” ,保存配置文件。

PicGo 图床配置步骤 32

1
2
3
4
5
6
7
8
9
{
"picBed": {
"uploader": "smms",
"smms": {
"token": "Fg8H9wYgYOdoOVmT94YlamD5hosy3nYX"
}
},
"picgoPlugins": {}
}

3.4. 大功告成

最后 ,点击 “验证图片上传选项” ,提示 “验证成功” ,则大功告成!

PicGo 图床配置步骤 33


4. 其他云服务器配置

其他云服务配置与前面三种云服务配置基本一致,故不再仔细列出,仅将各云服务与其对应配置文件给出如下:(双斜杠和后面的文字最后需删掉)

详细设置见见PicGo官方指南:https://picgo.github.io/PicGo-Doc/

4.1. 七牛图床

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
{
"picBed": {
"uploader": "qiniu",
"qiniu": {
"accessKey": "",
"secretKey": "",
"bucket": "", // 存储空间名
"url": "", // 自定义域名
"area": "z0" | "z1" | "z2" | "na0" | "as0", // 存储区域编号
"options": "", // 网址后缀,比如?imgslim
"path": "" // 自定义存储路径,比如img/
}
},
"picgoPlugins": {}
}

4.2. 又拍云

1
2
3
4
5
6
7
8
9
10
11
12
13
14
{
"picBed": {
"uploader": "upyun",
"upyun": {
"bucket": "", // 存储空间名,及你的服务名
"operator": "", // 操作员
"password": "", // 密码
"options": "", // 针对图片的一些后缀处理参数
"path": "", // 自定义存储路径,比如img/
"url": "" // 加速域名,注意要加http://或者https://
}
},
"picgoPlugins": {}
}

4.3. GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
{
"picBed": {
"uploader": "github",
"github": {
"repo": "", // 仓库名,格式是username/reponame
"token": "", // github token
"path": "", // 自定义存储路径,比如img/
"customUrl": "", // 自定义域名,注意要加http://或者https://
"branch": "" // 分支名,默认是master
}
},
"picgoPlugins": {}
}

4.4. Imgur

1
2
3
4
5
6
7
8
9
10
{
"picBed": {
"uploader": "imgur",
"imgur": {
"clientId": "", // imgur的clientId
"proxy": "" // 代理地址,仅支持http代理
}
},
"picgoPlugins": {}
}

四.选择一个合适的上传工具

可以通过工具将本地的图片上传到图床服务上。常用的上传工具有PicGo、uPic、Typora等等,不同的上传工具具有不同的特点和功能,可以根据自己的需求选择一个适合自己的上传工具。

五. 将上传工具配置好

将上传工具配置好,需要填写图床服务商提供的API密钥、上传地址、图片保存路径等信息。不同的上传工具配置方式可能不同,可以参考工具提供的文档进行操作。

六. 开始使用

配置好上传工具后,就可以开始使用了。将本地的图片拖拽到上传工具中,上传成功后会返回图片URL,将URL复制到需要插入图片的位置即可。