如何搭建自己的图床(GitHub版)

文章目录

  • 1.图床的概念
  • 2.用GitHub创建图床服务器
    • 2.1.新建仓库
    • 2.2.生成Token令牌
    • 2.3.创建img分支和该分支下的img文件夹(可选)
  • 3.使用PicGo软件上传图片
    • 3.1 下载PicGo软件
    • 3.2配置PicGo
    • 3.3用PicGo实现上传
  • 4. Typora实现自动上传
  • 5.免费图片网站

前言: 如果没有自己的服务器,如何实现接口去获取图片呢?我们可以使用图床的形式。

1.图床的概念

图床就是存储图片的服务器

  • 由来:通常我们的图片都是保存在本地,比如我们常用Typora写的笔记,里面的图片都默认保存在本地,这时候我们如果把对应的笔记发给别人,那么笔记的图片也要跟着发过去(同时确保图片的路径是对的),这样别人才能完整查看到我们的笔记。
  • 问题:老是要传来传去的,这样很麻烦。
  • 解决:这时候我们想到如果把图片放在互联网上,这时候任何人都可以看见并且能下载,就完美解决了。那么我们把别人也可以访问到图片的服务器叫做图床。

2.用GitHub创建图床服务器

步骤:
1)新建仓库
2)生成Token令牌
3)创建img分支和该分支下的img文件夹(可选)

2.1.新建仓库

点击+号->New repository->填写相关信息-> Create repository

在这里插入图片描述

在这里插入图片描述

2.2.生成Token令牌

点击右上角头像->Settings->下拉,直到左侧到底,选择Developer settings(开发人员设置)->Personal Access tokens(个人访问令牌) -> Tkens(classic) -> Generate New Token(classic, 一定要选择 classic 方式)-> 配置相关信息 -> Generate token
Token令牌用于个人身份验证,不需要密码也可以直接访问你的仓库内容。

在这里插入图片描述

在创建页面中,填写 Note 为“图床”,Expiration(过期时间)为 No expiration(永久),也可以自定义过期时间,在下面的Select scopes(选择权限范围)如下图勾选 repo。最后点击 generate token 生成令牌即可。

在这里插入图片描述

务必将令牌保存起来,放在一个安全的地方,页面关掉后就看不到了。

在这里插入图片描述

2.3.创建img分支和该分支下的img文件夹(可选)

创建img分支

点击自己的仓库->main->View all branches->New branch->分支名->Create new branch

在这里插入图片描述在这里插入图片描述

创建img文件夹

Add file -> Create new file -> 填写 img/test -> Commit changes
在这里插入图片描述

在这里插入图片描述

3.使用PicGo软件上传图片

3.1 下载PicGo软件

PicGo是一个用于上传图片的客户端,支持拖拽上传、剪贴板上传,功能十分方便。

官网地址
PicGo的Github地址
山东大学PicGo镜像地址

3.2配置PicGo

选择图床设置->Github

这里需要配置GitHub仓库地址、分支名、AccessToken等基础信息。
自定义域名需要配置为:https://cdn.jsdelivr.net/gh/用户名/仓库名,这样就才可以通过cdn访问图片
仓库名:GitHub用户名/GitHub仓库地址
分支名:GitHub的分支名称
Token:GitHub中设定的AccessToken
自定义域名:https://fastly.jsdelivr.net/gh/用户名/仓库名

3.3用PicGo实现上传

直接拖拽上传即可

在这里插入图片描述

上传完成会在相册中查看到或者直接在GitHub仓库中查看

4. Typora实现自动上传

Typora通过PicGo软件自动上传图片到GitHub仓库中。

文件 ->偏好设置 -> 图像 -> 上传图片 -> 配置PicGo路径

在这里插入图片描述

在这里插入图片描述

5.免费图片网站

这里我推荐三个好看的壁纸网站,而且是免费下载的

Wallpaper Abyss
Awesome Wallpapers
WallpapersWide.com

如果图片过大会占用过多存储,这时候我们可以压缩图片,优化网页的性能,同时节省存储空间,这里推荐一个在线图片压缩网站。

压缩图片网站TinyPNG

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/26677.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Xshell配置以及使用教程

目录 一、Xshell介绍 二、安装Xshell 三、使用Xshell连接Linux服务器 一、Xshell介绍 Xshell 分为免费版和专业版,是一款远程连接虚拟机系统的 SSH 客户机软件; Xshell免费版官网下载地址:家庭/学校免费 - NetSarang Websitehttps://www…

半小时漫画计算机

ISBN: 978-7-121-41557-9 作者:刘欣(码农翻身) 绘画:刘奕君 页数:210页 阅读时间:2023-06-03 推荐指数:★★★★★ 以漫画的形式来讲解计算机的基础知识, 主要涉及到CPU、内存、网络…

“layui助力博客管理升级!用增删改查功能打造优质博客体验“

目录 引文1.前置条件2.数据接口2.1 UserDao(CRUD)2.2 R工具类 3.HTML 结构3.1 主界面的HTML3.2 用户的查询所有界面的HTML3.3 新增修改通用的的HTML 4.JavaScript 代码4.1 用户的CRUD javaScript 代码(userManage)4.2 新增修改的javaScript代码(userEdit) 5. 运行截图总结 引文…

kubernetes中特定域名使用自定义DNS服务器出现的解析异常

故障发生背景: 租户反馈生产业务服务连接到中间件的时候,偶尔会有连接失败的情况,然后我们查看对应组件服务正常,手动请求组件服务也显示正常,让租户查看业务服务日志发现报错无法解析对应的域名,我们手动是…

【雕爷学编程】Arduino动手做(163)---大尺寸8x8LED方格屏模块7

37款传感器与模块的提法,在网络上广泛流传,其实Arduino能够兼容的传感器模块肯定是不止37种的。鉴于本人手头积累了一些传感器和执行器模块,依照实践出真知(一定要动手做)的理念,以学习和交流为目的&#x…

laravel6.x文档阅读手册

laravel中文文档6.x 目录 一、入门指南 安装 服务器要求 安装 Laravel Laravel 使用 Composer 来管理项目依赖。因此,在使用 Laravel 之前,请确保你的机器已经安装了 Composer。 通过 Laravel 安装器 首先,通过使用 Composer 安装 Lara…

Pod:Kubernetes里最核心的概念

为了解决这样多应用联合运行的问题,同时还要不破坏容器的隔离,就需要在容器外面再建立一个“收纳舱”,让多个容器既保持相对独立,又能够小范围共享网络、存储等资源,而且永远是“绑在一起”的状态。 Pod 的概念也就呼…

我在VScode学Java类与对象(Java的类与对象、this关键字)第一辑

我的个人博客主页:如果’真能转义1️⃣说1️⃣的博客主页 关于Java基本语法学习---->可以参考我的这篇博客:《我在VScode学Java》 关于我在VScode学Java(Java方法method) 类是描述了一组有相同特性(属性&#xff09…

从实体按键看 Android 车载的自定义事件机制

在汽车数字化、智能化变革的进程中,越来越多的车机设计或部分、或全部地舍弃了实体按键,进而把车主操作的入口转移到了车机 UI 以及语音助手。 但统一、高效的零层级 UI 颇为困难,语音的准确率、覆盖率亦不够完善,那么在当下的阶段…

PCIe总线的链路训练

目录 概述 链路训练的目的 几个关键概念 Lane reveral : Polarity inversion: De-skew: link number: Lane number: Bit lock: Symbol lock: 几个特殊序列: TS1和TS2&am…

微软开源了一个 助力开发LLM 加持的应用的 工具包 semantic-kernel

在首席执行官萨蒂亚纳德拉(Satya Nadella)的支持下,微软似乎正在迅速转变为一家以人工智能为中心的公司。最近微软的众多产品线都采用GPT-4加持,从Microsoft 365等商业产品到“新必应”搜索引擎,再到低代码/无代码Powe…

手把手教你写通讯录(含动态版)

目录 一、框架 二、实现 1.初始化通讯录 2.增加联系人 3.打印通讯录 4.删除联系人 5.修改联系人 6.查找联系人 7.退出通讯录 8.拓展:通讯录排序 9.全代码 三、动态版 1.结构体修改 2.初始化修改 3.扩容实现 4.善后函数 5.全代码 一、框架 实现通讯录…