使用github免费空间配合jsDelivr CDN搭建个人图床

这套方案是Github的空间+jsDelivr的CDN+PicGo图床工具,全部免费使用且效果不错,非常适合个人博客等网站使用,配合使用体验佳。

一、创建github

网站:https://github.com

登陆github(这个网站如果不知道就太不应该了),没有账号就新注册一个也不麻烦。github哪都好除了在我们国内的网速问题,所以以下操作也许需要你科学上网。

登陆后回到首页,新建一个项目

使用github免费空间配合jsDelivr CDN搭建个人图床-懵比小站

根据下面的截图填写,第一个Repository name为项目名,可以随意填写。例如我这里为:assets。

使用github免费空间配合jsDelivr CDN搭建个人图床-懵比小站

创建完毕后,打开地址:https://github.com/settings/tokens,以获取tokens。

使用github免费空间配合jsDelivr CDN搭建个人图床-懵比小站

勾选repo即可。

使用github免费空间配合jsDelivr CDN搭建个人图床-懵比小站

tokens只显示一次务必保存好。

使用github免费空间配合jsDelivr CDN搭建个人图床-懵比小站

二、PicGo设置

PicGo软件开源地址:PicGo

下载PicGo客户端,考虑到github在国内的网速问题,我这里为大家提供蓝奏的网盘下载链接。目前PicGo最新版本为v2.2.2

Mac版:PicGo-2.2.2.dmg

Windows版:PicGo-Setup-2.2.2.exe

安装完毕后打开PicGo,windows版默认最小化,所以在右下角找到并打开,找到图床设置——GitHub图床。

[infobox]

设定仓库名:用户名/项目名。例如我的用户名freessir,项目名assets

设定分支名:默认master

设定Token:上一步保存的Tokens

指定存储路径:随意取名。例如我取名为img,则会在项目里多出img的文件夹。注意要用“/”结尾!

设定自定义域名:https://cdn.jsdelivr.net/gh/+仓库名

[/infobox]

使用github免费空间配合jsDelivr CDN搭建个人图床-懵比小站

不要忘了点确定。现在你可以尝试通过PicGo软件上传图片,成功后会自动复制外链到粘贴板,你要做的只是粘贴(ctrl+c)即可。

其他设置

PicGo默认上传成功后自动存储图片链接到粘贴板,我们可以自定义链接格式。

[infobox]

MarkDown格式:![](https://cdn.jsdelivr.net/gh/freessir/assets/img/示例.png)

HTML格式:<img src=”https://cdn.jsdelivr.net/gh/freessir/assets/img/示例.png”/>

URL格式:https://cdn.jsdelivr.net/gh/freessir/assets/img/示例.png

UBB格式:[IMG]https://cdn.jsdelivr.net/gh/freessir/assets/img/QQ截图20200311114051.png[/IMG]

Custom格式:https://cdn.jsdelivr.net/gh/freessir/assets/img/示例.png

[/infobox]

如果我们用来写wordpress博客,URL格式即可。在wordpress编辑器上“方添加媒体—从URL插入”,复制链接。

使用github免费空间配合jsDelivr CDN搭建个人图床-懵比小站

在相册里,能看到上传的历史记录,并对历史图片进行复制链接、编辑文件名和删除操作。复制的链接会随着链接格式的改变而相应改变;删除只是删除了本地的历史记录,并不能删除存在github里的源图片。

jsDelivr

官网:https://www.jsdelivr.com

能够集成 Github、NPM 资源,只需要通过符合 JSDelivr 规则的 URL 引用,即可直接使用 Github 中的资源。而且!在中国大陆唯一有 license 的公有 CDN!鼓掌。

使用github免费空间配合jsDelivr CDN搭建个人图床-懵比小站

我们可以看到,在国内的访问速度确实不错。缺点就是有的地区还没有节点,不过胜在免费!

使用github免费空间配合jsDelivr CDN搭建个人图床-懵比小站

PicGo只是一个便捷上传到github并获取外链的工具而已,我们可以跳过PicGo手动上传图片到github并修改成jsDelivr的链接形式,一样可以实现PicGo的功能。

本文系作者 @ 原创发布在 懵比小站。未经许可,禁止转载。

喜欢()
评论 (0)
热门搜索
homeagain
分享互联网最新资讯,分布各类教程:苹果cms、vps推荐、宝塔建站知识、edu邮箱、wordpress模板下载……只有你想不到,没有出不了的教程。
248 文章
198 评论
123 喜欢
Top