0
  • 聊天消息
  • 系统消息
  • 评论与回复
登录后你可以
  • 下载海量资料
  • 学习在线课程
  • 观看技术视频
  • 写文章/发帖/加入社区
会员中心
创作中心

完善资料让更多小伙伴认识你,还能领取20积分哦,立即完善>

3天内不再提示

基于Picgo+GitHub+ jsDelivr搭建CDN加速免费图床

电子设计 来源:电子设计 作者:电子设计 2020-12-24 18:02 次阅读
加入交流群
微信小助手二维码

扫码添加小助手

加入工程师交流群

前言

经常写Markdown或者博客的同学,肯定都要用到图床。图床是什么呢?其实相当于一个存储图片的网站,类似百度云这样,不过上传图片到图床后可以直接通过外链进行访问。

比如把本地一张a.jpg上传到图床后,便可以拿到一个链接:

https://www.xxx.com/img/a.jpg

然后点击这个链接就可以访问图片a了。今天来聊聊怎么搭建可靠的图床吧~

为什么会产生这个需求呢?因为小编经常写博文什么的,现在的做法是在简书上上传图片,然后把生成的图片链接放到Markdown文档上面,写好文档以后就可以批量复制到各大博客平台投稿了。

但是这样有个隐患:万一简书哪天挂掉了,那么我放到csdn、cnbolgs等这些平台的文章图片都会挂掉。即使简书一直维持现状,但万一哪天它不高兴了,做了个外链防盗(图片外链只能在本站显示),那同样会遇到上面的问题。

比如小编之前放在简书上的文章,复制到csdn上后。不知道怎么回事:

说多了都是泪。因此,趁早做好准备,免得以后出现问题就麻烦了。毕竟有些博客的图片只是随手一截,还真找不到备份……

前期准备平台选择

现在也有蛮多的图床平台可以选择,常见的有SM.MS图床、腾讯云COS、微博图床、GitHub图床、七牛图床、Imgur图床、阿里云OSS、又拍云图床等。

而这里边,SM.MS和Imgur有免费版也有收费版,腾讯云、七牛、阿里云、又拍云都是收费的,微博图床据说已经挂了。其他小站的就不推荐了,因为指不定哪天就挂了。

那么,也就剩下GitHub安全、免费又可靠了(微软爸爸护着呢!)。现在微软接管了GitHub以后,貌似公有仓库已经不限个数了,而且单个仓库容量已经放宽至2GB。这绝对够用了,不够就再建一个共有仓呗。最重要的还是免费,配合CDN加速,访问也不成问题。嗯,就微软爸爸了!

工具选择

选择一个本地的上传工具是为了方便我们快速上传图片,获得图片外链。这里首选picgo。

这款小工具非常强大,其中最赞的就是那个剪切板图片上传功能,在QQ或者微信截图截好图片后,可以点击剪切板图片上传或者通过快捷键,它就会把当前剪切板中的图片上传到配置到图床中。可以看到上传所有图片,点击即可复制需要的图片外链格式:

配置

准备完毕就可以着手配置了。先去GitHub,没有账号的先注册一个账号。

GitHub配置

1. 创建Repository

鼠标移动到右上角,点击"New repository"按钮:

填写相关信息,创建一个存储图片的仓库:

2. 配置token key

生成一个Token用于操作GitHub repository。回到主页,点击"Settings"按钮:

进入页面后,点击"Developer settings"按钮

点击"Personal access tokens"按钮,然后点击Generate token:

填写描述,选择"repo"权限,然后拉到下面点击"Generate token"按钮

注意:创建成功后,会生成一串token,这串token之后不会再显示,所以第一次看到的时候,可以用个小本本保存起来哦,忘记了只有重新生成,每次都不一样。

Picgo配置

拿到了刚刚记录了GitHub token后,打开picgo,按照如下设置即可:

设定仓库名按照“账户名/仓库名的格式填写”,比如我的是:dengfaheng/image01。

分支名统一填写“master”。

设定Token将之前的Token粘贴在这里。

指定存储路径留空。

自定义域名的作用是在上传图片后成功后,PicGo会将“自定义域名+上传的图片名”生成的访问链接,放到剪切板上。默认留空也可以正常使用。这里为了使用CDN加快图片的访问速度,自定义域名我们按照这样去填写:

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

比如我的是:

https://cdn.jsdelivr.net/gh/dengfaheng/image01

点击确定后就配置完成了,我们截图后点击剪切板图片上传,如果上传成功,拿到的外链放到Markdown中正常访问,就OK啦。

当然快捷上传的快捷键也可以到设置中进行配置。可以看到GitHub仓库中多了很多我们上传的图片。

也可以在picgo中对上传的图片进行相关操作,不过这里的删除只是删除picgo中的图片而言,GitHub上的不会删除哦。

至于如何删除GitHub上的图片,emmm……那说来就话长了。。就不说了。大家还是不要删了,空间不够了再开个仓库即可。

审核编辑:符乾江
声明:本文内容及配图由入驻作者撰写或者入驻合作网站授权转载。文章观点仅代表作者本人,不代表电子发烧友网立场。文章及其配图仅供工程师学习之用,如有内容侵权或者其他违规问题,请联系本站处理。 举报投诉
  • CDN
    CDN
    +关注

    关注

    0

    文章

    330

    浏览量

    30459
  • GitHub
    +关注

    关注

    3

    文章

    484

    浏览量

    18428
收藏 人收藏
加入交流群
微信小助手二维码

扫码添加小助手

加入工程师交流群

    评论

    相关推荐
    热点推荐

    每周推荐!大佬收藏的电机精选资料免费分享

    基于LABVIEW电机资料 21份LabVIEW电机测控开发资料包 ,含仿真、控制、监测等实战案例!助力工程师快速搭建系统,提升开发效率~ 5、免费下载!66份基于DSP电机资料 免费下载!66份DSP电机控制
    发表于 06-04 16:19

    Windows Arm64托管运行器正式支持GitHub Actions

    的面向 GitHub Copilot 的 Arm 扩展程序,更是进一步简化并加速了向 Arm 架构服务器的迁移过程。双方的共同努力正在赋能开发者,使其能够在 Arm 平台上进行更快、更智能和更高效的开发工作。
    的头像 发表于 04-28 14:23 908次阅读

    如何监控RAKsmart CDN的性能?

     RAKsmart CDN拥有遍布全球的多个数据中心节点,通过将网站的静态资源缓存到这些节点上,使用户能够从距离他们最近的服务器获取内容,从而大大减少了页面加载时间,提高了网站的访问速度,以下是一些监控RAKsmart CDN性能的方法。主机推荐小编为您整理发布。
    的头像 发表于 03-31 11:06 424次阅读

    Arm推出GitHub Copilot新扩展程序

    Arm 控股有限公司(纳斯达克股票代码:ARM,以下简称“Arm”)宣布其已正式推出专为 GitHub Copilot 设计的新扩展程序。GitHub Copilot 是全球部署最广泛的人
    的头像 发表于 02-24 10:14 898次阅读

    cdn软件是什么?与PCDN有什么不同

    CDN(内容分发网络)软件是一种通过分布式服务器节点缓存和分发内容的工具,旨在加速用户访问速度并减轻源服务器压力。
    的头像 发表于 02-07 09:06 1987次阅读

    靠谱的高防cdn费用高吗?

    高防CDN的成本相较于普通CDN确实更高,但费用是否“高”需结合其防护价值和业务需求综合判断。高防CDN整合了内容分发加速与DDoS攻击防御能力,需投入大量资源构建分布式节点、清洗中心
    的头像 发表于 02-05 11:06 764次阅读

    cdn是什么技术 cdn是怎样提高网站速度的

    一、CDN技术概述 CDN,全称Content Delivery Network,即内容分发网络,是一种通过在网络各处部署节点,将内容缓存至离用户更近的地方,以减少数据传输延迟和提高访问速度
    的头像 发表于 01-31 15:41 2120次阅读

    华为云 Flexus 云服务器 X 实例——部署 EduSoho 网校系统、二次开发对接华为云视频点播实现 CDN 加速播放

    CDN 加速播放。 edusoho 本地存储的视频播放存在诸多弊端。一方面,本地存储受限于服务器的性能和带宽,当大量用户同时访问时,很容易出现加载慢的情况。尤其是在高峰时段,视频的加载可能会变得极为缓慢,甚至出现卡顿、无法播放的现象,极大地影响了用户
    的头像 发表于 01-23 18:05 840次阅读
    华为云 Flexus 云服务器 X 实例——部署 EduSoho 网校系统、二次开发对接华为云视频点播实现 <b class='flag-5'>CDN</b> <b class='flag-5'>加速</b>播放

    cdn是云服务吗 cdn是干什么用的

    在当今这个信息爆炸的时代,互联网用户对于内容的加载速度和质量有着极高的要求。无论是视频流、图片还是网页,用户都希望能够在点击链接的瞬间就能获得响应。为了满足这种需求,CDN(内容分发网络)应运而生
    的头像 发表于 01-19 14:30 2956次阅读

    cdn的优势和劣势

    CDN的优势 1. 加速内容传输 CDN通过在全球范围内部署边缘服务器,将内容缓存到离用户更近的地方,从而减少数据传输的延迟,加快内容加载速度。这对于提高用户体验至关重要,尤其是在用户分布在全球各地
    的头像 发表于 01-19 14:28 3874次阅读

    cdn是什么类型的服务

    在当今的数字化时代,互联网已成为人们获取信息、交流和娱乐的主要渠道。随着网络技术的飞速发展,用户对网络内容的访问速度和稳定性的要求越来越高。为了满足这些需求,CDN服务应运而生,它通过在全球范围内
    的头像 发表于 01-19 14:26 2651次阅读

    使用myCobot 280机械臂结合ROS2系统搭建机械分拣站

    这篇文章是来自Automatic Addison的开源项目,已获作者授权转载自github。本项目的主要内容是使用myCobot 280机械臂结合ROS2系统搭建机械分拣站。
    的头像 发表于 01-15 09:22 1921次阅读
    使用myCobot 280机械臂结合ROS2系统<b class='flag-5'>搭建</b>机械分拣站

    gitee 与 GitHub 的比较

    在软件开发领域,代码托管平台扮演着至关重要的角色。它们不仅提供了代码存储和版本控制的功能,还促进了团队协作和开源项目的共享。Gitee(码云)和GitHub是两个最著名的代码托管服务提供商,它们在
    的头像 发表于 01-06 09:47 2268次阅读

    GitHub Copilot 可以免费使用了!

    “  这个标题有点标题党,虽然 Github Copilot 确实是可以免费使用,但这个免费是有限制的,聊天互动每月限制50次,代码补全(或者建议)每月2000次。不过这个 Copiot 真的是很好
    的头像 发表于 12-22 11:19 4288次阅读
    <b class='flag-5'>GitHub</b> Copilot 可以<b class='flag-5'>免费</b>使用了!

    超级干货!本地搭建代码托管平台Gitea

    1关于GiteaGitea是一个轻量级的Git托管服务,也就是基于Git的代码托管平台,类似于GitHub、Gitee等。Gitea相对于其他代码托管平台,是一个可以本地部署的开源项目,非常轻量化
    的头像 发表于 12-19 19:33 1303次阅读
    超级干货!本地<b class='flag-5'>搭建</b>代码托管平台Gitea