/ VPS相关 / 32浏览

在博客中使用Github作为个人图床

文章目录
  • 1.前言
  • 2.Github + JsDelivr 方案介绍
  • 3.使用 PicGo简化流程
  • 1.前言

    对于纯静态化部署的博客站点来说,一般写作时使用 markdown 来编写文章,当面面临需要使用图片的时候就会比较难办,一般有两种方式来解决此问题。

    方案一:最简单的方法就是将图片等媒体资源与站点文件耦合到一起,此方案虽然简单,但是使用起来比较麻烦引用图片的时候需要解决复杂的路径问题,而当博客部署的时候图片资源也会挤占我们有限的静态部署空间和网络带宽,体验不是太好。

    方案二:另一种方案则是实用图床将需要使用到的图片上传到一个统一的地方进行管理,在博客中直接插入图片在图床中的 URL 链接即可,此方案优点就是方便快捷并且节省静态服务的空间和网络资源,但是此方案的问题就是我们需要找到一个地方来托管我们的图片,对于纯静态无服务端的博客来说再弄个服务器来部署图片资源显然不太可能,那么图床的使用场景就应运而生,但是目前好用的图床并不多想找到一个靠谱的图床不容易,试想下突然有一天你所用的图床突然停止服务了,那么你所有的图片就都没了,这种代价应该是谁都无法接受。

    因此我此前在寻找图床过程中只有两个标准,1 稳定可控、2 访问速度,所以收费还是付费的我都测试过不少,但最终好多图床在第一条上都无法通过,因为没有控制权,如果哪天不能访问的话我们连把图片备份下来的机会都没有,然后基于这个因素我之后测试了实用 git 托管的方式来解决这个问题,后来考虑到访问速度因素,曾经有段时间我曾使用过 gitee 来托管图片,但是最近突如其来的审查机制导致这个方案也没法用了。

    2.Github + JsDelivr 方案介绍

    这个方案的的思路其实跟 gitee 几乎是一样的,都是使用 git 托管图片文件,因此我很快就将 gitee 上的文件迁移到了 github 因为它的的稳定性和可控性应该是最好的,但是 github 唯一的问题就是他的访问速度因为一些未知因素导致有些地方访问 raw.githubusercontent.com 域名下的文件会很慢甚至无法打开,因此在使用这个方案来托管了文件之后还要使用一个 CDN 来解决访问速度问题,目前做的比较好的就是 JsDeliver 的 CDN, 做前端的同学应该不陌生,它不但提供了很多 npm 以及 js 文件的加速,而且它还提供了 github 和 wordpress 的加速服务,并且使用简单,只需要替换 CDN 域名即可到达加速效果。
    例如加速 github 文件只需要将 github 的文件地址转换成如下地址即可:

    https://cdn.jsdelivr.net/gh/你的用户名/你的仓库名@发布的版本号/文件路径

    其中 @发布的版本号 是非必需的,如果不带默认取的是仓库主分支的最新文件。

    3.使用 PicGo简化流程

    PicGo 官网 https://picgo.github.io/PicGo-Doc/zh/guide/,它是一个多平台的可用于快速上传图片并获取 URL 链接的工具。

    3.1配置上传

    PicGo 支持多种上传,这里我使用 github 的图床设置。

    软件需要申请一个 token 来访问 github 仓库,访问https://github.com/settings/tokens创建token。

    点击 Generate new token 选择 Generate new token (classic)

    然后把 repo 的权限勾选,过期时间可以设置成永不过期。

    然后下滑到最底部,点击 Generate token 。复制 Token粘贴到PicGo里即可。

    注意:token 生成后只会显示一次,要及时复制备份。

    3.2安装插件

    PicGo 可以安装插件来自动对你的图片设置水印。在线安装的方式需要有 Node.js 的环境支持,如果你无法使用在线方式,可以参阅官方文档的其他方式进行安装。

    另外使用在线安装的方式是使用 Npm 来安装插件的,如果遇到下载问题可以设置插件下载代理或者 NPM 下载镜像。

    3.2.1.自动水印插件

    picgo-plugin-watermark

    安装配置如下,具体参数可去Github仓库查看。

    3.2.2.自动压缩插件

    picgo-plugin-compress

    设置压缩方式三选一。

    更新于

    0

    1. 感谢阅读

    发表回复

    您的邮箱地址不会被公开。 必填项已用 * 标注