2020年5月3日

WP-QINIU插件的引用方式

作者 ShangJian

为什么会找到这个插件,决定了用wordpress建站之后,每次写文章都需要引用一些图片,最初的选择是放在服务器上,这样做的好处是wordpress天生支持上传和引用,使用比较方便。 但是弊端就很多了:

  1. 我是使用docker建站,最初忘记了做容器和磁盘映射,这样重启服务之后图片也都没了
  2. 做了映射后,觉的占用服务器空间;
  3. 而且静态资源不加速,访问速度比较慢;

正好七牛云有10g内免费的服务,目前用下来整体印象还不错,所以就想着把媒体库和七牛打通,这样能解决上述的几个问题。在网上搜索之后发现几款能支持的软件:

  1. WPJAM,这个插件我也安装了一版本,但是用起来体感不好。 一方面,它的原理是CDN加速,不是重在图片资源的维护,不符合我的目标;再者,这个插件早年对七牛支持的还行,后续作者发布了一篇文章说七牛云发生了什么恶心的事儿,所以主推了阿里云和腾讯云的服务,对七牛的支持就只有老用户了;最后还读了一篇黑“我爱水煮鱼”的文章(https://www.dukeyin.com/2018/08/why-i-give-up-wpjam-qiniu-plugin/),就决定暂时不用这个插件来解决问题了;
  2. WP-QINIU,这个插件看起来能达成我的目标,所以重点研究了一下。安装步骤介绍推荐这片(https://www.sunweihu.com/2808.html?replytocom=2032#respond),除了少数兼容问题基本解决了80%的功能。但是有少数问题,例如: 数据存储访问域名的含义、缩略图预览、写文章无法引用七牛媒体库的问题,还没能很好的回答。这片文章主要是回答几个小问题;

因为WP-QINIU的功能完全符合我的目标,我给它的预期值很高,但很遗憾的是只实现了我50%的目标。大概研究了一个下午,最终得出的结论,是这个插件于2018年就停止更新了,但是wordpress的更新导致了兼容的问题,所以目前媒体库没办法引用到七牛云存储应该暂时没法解决了。

如果希望缩略图能够显示正确,需要确保两个点都正常工作:

1. 数据存储访问域名需要设置准确。这个字段的含义是猜出来的,因为在使用插件上传图片到七牛云之后,生成了一个连接,这个链接应该可以在浏览器中直接预览图片,如果浏览器打不开就是域名设置有问题。然后我们日常访问七牛的连接其实是通过七牛的“外链域名”实现的,所以我尝试了wordpress的“数据存储访问域名” == 七牛云的“外链域名”,完成了这一步。下面是截图,方便理解:

这个链接的域名前缀就是对应着插件的数据存储访问域名,很容易和七牛的“空间域名”搞混,如下图
实际上应该使用下面这个图中的外部连接域名

2. WP-QINIU插件的代码需要做一些修改,原因是有两个字段的设置没有意义,字段却是必填的,即使手工填写为空,也会自动被加上内容。有内容又会导致缩略图出不来,所以需要去掉必填选项,且把值设置为空。这两个字段可以看下面这个截图:

修改字段的类型为非必填需要调整代码,代码根据项目的发布方式不同需要找的位置也不同,所以我下面的内容,只看相对路径就好,绝对路径我稍作解释,方便理解。

对绝对路径的解释(可以忽略): 我的wordpress是通过rancher的cattle容器编排启动起来的,我把docker容器的磁盘映射到服务器磁盘上的路径是,容器内路径“/var/www/html” == 服务器路径“/var/lib/docker/volumes/wordpress”,因此我能够在“/var/lib/docker/volumes/wordpress/”找到wordpress的项目代码。

相对路径的解释: 进入“/var/lib/docker/volumes/wordpress/”目录后,都是wordpress的项目文件了,在“./_data/wp-content/plugins”路径下面找到对应的插件wp-qiniu,进而可以修改: vi wp-qiniu.php,修改点有两个: 1. 将默认值去掉;2. 将必填判断逻辑去掉;

1. 去掉默认值: 在代码中搜索”图片样式分隔符“,然后将下图中的 echo ‘-‘ 改为 echo ”。
2. 将必填判断逻辑去掉: 在代码中搜索”缩略图片样式名不能为空“,然后按照下图注释掉非空判断的代码。

到这一步,在媒体库中上传图片到七牛云,并且能拿到预览和外链已经完成了。但是写文章的时候无法引用七牛云媒体库图片的问题确实很让人头疼,一度想到放弃WP-QINIU这个插件,甚至想试试别的建站工具了…

后来想到了一个折中的解决办法,既然上传图片能够拿到外链,文章中也支持用url插入,索性就麻烦一点用人工智能来解决吧。每次准备图片素材需要做如下几步:

  1. 需要先在媒体中找到七牛云存储插件入口
  2. 然后上传图片并且拿到外链,复制好
  3. 回到文章页面,用URL插入图片

是不是很蠢,暂时没有好的办法,如果哪天冲动了,也许跑过去看看WP-QINIU的源代码,看是否能改代码实现一下…

后记

我后来安装了classic editor插件,发现可以在网页版上面直接插入七牛资源库的内容了,但是app版的wordpress仍然读取不到