wordpress 插件 – 使用 Github 作为免费图床

前言

插件名称 wp-github-gos, 本插件核心功能使用了 GitHub API

设置页面和核心业务逻辑主要参考插件 wordpress-qcloud-cos 的实现,替换了其中 腾讯云 COS 官方 SDKGitHub API

插件特色

  • 使用 GitHub 仓库存储 WordPress 站点图片等多媒体文件

  • 可配置是否上传缩略图和是否保留本地备份

  • 本地删除可同步删除腾讯云上面的文件

  • 支持替换数据库中旧的资源链接地址

  • 支持在图片链接地址后面自定义拼接图片宽度高度大小三个参数

  • 建议使用 jsdelivr 免费加速 github 下的图片,速度还是很可以的

插件缺点

  • 使用 Github API 同步图片等附件的时候速度相较于国内的免费图床比较慢 😅

  • 未来不知道会不会被屏蔽 🙂

安装

从 Github 下载源码,通过 WordPress 后台上传安装,或者直接将源码上传到 WordPress 插件目录 wp-content/plugins,然后在后台启用

Github 项目地址: https://github.com/niqingyang/wp-github-gos

修改配置

方法一:在 WordPress 插件管理页面有设置按钮,进行设置

方法二:在 WordPress 后台管理左侧导航栏设置下 Github 存储,点击进入设置页面

特别说明

本插件仅支持PHP 5.4+ 版本

设置

因为本插件使用了 Github API,所以需要使用者进行一下操作:

  1. 注册一个 Github 账户
  2. 并创建一个用于存放附件的公开的仓库
  3. 创建一个 access token

点击 settings 菜单
点击 settings 菜单

进入 Developer Settings 页面创建 Token
进入 Developer Settings 页面创建 Token

勾选必要的权限
勾选必要的权限

  1. Github 账户名仓库名access token 粘帖到该插件设置页面中相应的位置

填写相关设置
填写相关设置

  1. URL前缀的格式为 https://raw.githubusercontent.com/{用户名}/{仓库名}/master/,或者 https://raw.githubusercontent.com/{用户名}/{仓库名}/master/{本地文件夹},“本地文件夹” 务必与上面设置的 “本地文件夹” 保持一致(结尾无/)

  2. 设置自己的域名:可以使用 Github Page 的域名,也可以用 CNAME 将自己的域名解析到 Github Page 的域名 上, 然后将https://raw.githubusercontent.com/{用户名}/{仓库名}/master/ 替换成自己的域名就可以了

  3. 💥💥 国内访问 github 速度不是很理想,可以使用 jsdelivr 免费加速 github,只需要将 URL 前缀设置格式为 https://cdn.jsdelivr.net/gh/{用户名}/{仓库名}/即可

插件预览

设置页预览
设置页预览

常见问题

1、怎么替换文章中之前的旧资源地址链接

这个插件已经加上了替换数据库中之前的旧资源地址链接功能,只需要填好对应的链接即可,如图所示

WP-Editor.md

本站使用的 Markdown 编辑器是 WP-Editor.md,非常好用,此处推荐一下,如果你也使用的是这个插件,那么可以通过在主题模板下的 functions.php 文件中加入下面的代码,即可实现在编辑器中粘帖截图上传的功能:

更新记录

V1.0 – 2019/07/23

  • 使用 GitHub 仓库存储 WordPress 站点图片等多媒体文件
  • 可配置是否上传缩略图和是否保留本地备份
  • 本地删除可同步删除腾讯云上面的文件
  • 支持替换数据库中旧的资源链接地址
  • 支持在图片链接地址后面自定义拼接图片宽度、高度、大小三个参数

V1.1 – 2020/06/28

  • 根据 Github API 的变更,将 access_token 参数淘汰,请求时将其放入请求头中
  • 优化上传,偶发性的会发生 cURL error 35 错误,这种错误会重新尝试最多三次上传
  • 优化上传,发生未知的错误会将其捕获并反馈到前端显示上传失败
  • 为便于调试上传,支持将上传及错误信息记录日志,默认是关闭的

最后

感谢 Github 为开发者提供的服务,也希望大家能够善待 Github,毕竟存储和访问都是在消耗 Github 白花花的银子,切勿恶意滥用 ~

20 条评论

发表评论

*

  • @行风
    大佬,使用 jsdeliv的cdn如果图片库超过50m就会显示

    请问有没有什么办法?我一个图片也就几m,但是整个uploads就大了

    • 你图片的链接是什么?怎么配置的?超过50m显示了什么?我表示比较懵 ~

      • 大佬好,是“Package size exceeded the configured limit of 50 MB”
        我加了个符号这英文就没显示 ,jsd的限制,其实我很奇怪,如果我直接访问 https://cdn.jsdelivr.net/gh/{用户名}/{仓库名}@master/XXX.webp就可以,但是https://cdn.jsdelivr.net/gh/{用户名}/{仓库名}@master就会显示库超过50m。
        我看了网上有个办法是直接生成release,用版本号代替{仓库名}@后的分支名。
        但是每个版本不同,连接都已经固定,不太适合您这插件吧?是我哪里出错了?求教

        • https://cdn.jsdelivr.net/gh/{用户名}/{仓库名}@master/pathto/image 这种访问方式应该就可以,我库里的图片现在太少,没办法复现你的问题 ~ 如果实在不行就分仓库吧

          @TA
      • 好的谢谢您,我再试试,不行的话,我想在GitHub上提个feature,方便切换仓库,不太清楚是否能直接通过插件控制GitHub生成release

  • 你好,楼主,同样是使用的Editor.md, 然后代码是啥?方便告知下么
    需要在Editor设置中关闭上传源么?

    • 我这边改造的代码已经在文章中贴出来了,你说的“关闭上传源”我在设置中没有找到,应该是不用

      • 这…..文章中一片白,看不到,审查元素也没有显示有代码啊

        • 刚测试,才发现博客文章中的代码段在部分电脑上不显示,文章中的代码已发邮件给你了…

          @TA
    • 我用的是 Editor.md 插件来编辑文章,自带的粘帖上传图片的功能,和文章中这个插件可以比较好的搭配,推荐使用