图床 | Anubis的小窝

hexo

经验

发布日期: 2022-06-09

更新日期: 2023-12-21

文章字数: 1.4k

阅读时长: 5 分

一、什么是图床

图床其实是互联网中存储图片的空间，作为一个人的云端图片链接

二、为什么要图床

大部分人写博客都用markdown，而markdown的图片是通过链接的方式进行传输的的，因此，如果是在本电脑上直接嵌入的文件没办法在网络上访问（除非你把电脑长时间开机并且开放~极其危险）。

因此一个云图片链接就很有必要了，而网上直接找到的链接不具有可靠性，可能哪天就挂了（自己搭图床也不知道什么时候挂），因此搭建自己的图床还是很有必要的。

三、怎么搭建图床

大家可以使用一些免费（必须）的图床

GitHub（慢，免费）

这里选择的是通过GitHub来搭建个人图床（珍惜GitHub吧，它已经被开发了很多奇怪的用法）

1. 准备工作

一个 Github 账号

2. 搭建工作

登录你的 Github 之后，创建一个新的仓库
填写仓库先关资料，一般只需要选一个合适的仓库名，然后确保仓库为 public 其他的保持默认就好；
一般创建成功之后，会出现如下界面，至此，我们的图床算是创建好了，接下来就是如何上传图片了；

3.上传图片

通过上面的步骤，我们的图床时搭建好了，但是通过传统的方法向 Github 上传图片太麻烦了，这里我们推荐使用一个开源图床工具 PicGo （windows 系统下载.exe）来作为我们的图片上传工具；

安装完成后，主界面如下：

GitHub 生成令牌
- 跳转网址
```
https://github.com/settings/tokens
```
- 生成令牌
勾选信息并生成令牌

token 生成，注意它只会显示一次，所以你最好把它复制下来到你的备忘录存好，方便下次使用，否则下次有需要重新新建；
配置 PicGo

4. CDN 加速（必须使用）

自定义域名（cdn）加速，在自定义域名处填写

https://fastly.jsdelivr.net/gh/用户名/仓库名

这个也被墙了，现在 cdn 都不是很好用

6. Typora 自动上传

下载链接

（仅供学习使用，商业用途请支持正版）：https://wwp.lanzout.com/ilAou064myvi

使用教程

验证图片上传选项（若失败，配置Picgo.app 的监听端口）

打开PicGo,配置Picgo.app 的监听端口

测试图片上传，复制图片到Typora

6.常见问题

未完待续

腾讯cos/阿里oss（快，收费）

特别强调，使用对象存储容易遭受 cc 攻击，从而产生天价账单，下面的内容不进行删除，但是目前已经不再推荐使用对象存储来作为图床

阿里云

购买

注册登陆阿里云（推荐用支付宝登陆，方便），找到对象存储服务并购买。

创建 Bucket

来到阿里云对象存储控制台，创建存储

使用 PicGO

这里还是推荐使用 PicGO

下列内容转自 PicGo 官方文档

配置项及说明：

{
  "accessKeyId": "",
  "accessKeySecret": "",
  "bucket": "", // 存储空间名
  "area": "", // 存储区域代号
  "path": "", // 自定义存储路径
  "customUrl": "" // 自定义域名，注意要加http://或者https://
}

首先先在阿里云 OSS 的控制台里找到你的accessKeyId和accessKeySecret：

创建一个bucket后，存储空间名即为bucket:

确认你的存储区域的代码：

也可以在bucket页面找到：

如上图，存储区域就是 oss-cn-beijing

存储路径比如 img/ 的话，上传的图片会默认放在 OSS 的img文件夹下。注意存储路径一定要以/结尾！存储路径是可选的，如果不需要请留空。

配置自定义域名

这步不是必须的，但是使用自己的个人域名，在需要进行资源转换时会方便很多，而且没啥成本，只需要一个子域名而已

腾讯云

购买

注册登陆腾讯云，找到对象存储服务并购买。

创建存储桶

进入 cos ，创建存储桶

使用 PicGo

下列文章来自 PicGo 官方文档

配置项及说明：

{
  "secretId": "",
  "secretKey": "",
  "bucket": "", // 存储桶名，v4和v5版本不一样
  "appId": "",
  "area": "", // 存储区域，例如ap-beijing-1
  "path": "", // 自定义存储路径，比如img/
  "customUrl": "", // 自定义域名，注意要加http://或者https://
  "version": "v5" | "v4" // COS版本，v4或者v5
}