利用七牛云存储缓存Gravatar头像加速 WordPress

博客本身评论比较多,如果文章评论量超过30条后,就严重影响文章的载入时间了。所以给Gravatar头像加速成了必须要解决的问题了,今天分享一个“利用七牛云存储缓存Gravatar头像”的方法。

利用七牛云存储缓存Gravatar头像加速 WordPress

原理其实很简单,就是借助七牛云的“对象存储”拉取Gravatar的SSL服务器(当然也可以使用多说服务器)上的头像图片转存到七牛空间来实现,如果再在“对象存储”空间上再开启七牛云的融合CDN的话那就超级完美了,当然不使用CDN单就七牛空间的速度也比原有的强出了很多。下面给大家具体的实现方法,整体下来最多20分钟就可以搞定了

 

首先,当然是注册个七牛云账号并通过实名认证了,然后登陆七牛云账号新建一个“对象存储”空间,空间名字可以任意英文组合即可,镜像源要设成https://secure.gravatar.com/以便拉取 Gravatar 官网的头像图片(当然你也可以设定成多说 Gravatar 头像服务器地址)

 

然后根据自己WordPress主题使用到的头像尺寸设定七牛云对象存储空间的“图片样式”,参照 Gravatar 官方头像不同 size 的图片,依次是?s=40、60、80、100、120(你可以审查元素看看)

Begin 主题来说32、40、60、80、100尺寸是最合适的,所以分别创建“图片样式”

每个图片处理样式就参照上图设定即可,样式名称即为尺寸数字即可

至此七牛云存储端设置全部完成,剩下的就是在 WordPress 所使用的主题下根目录下的function.php里添加如下代码替换 WordPress 默认评论头像地址:

  1. //缓存Gravatar 头像到七牛云存储,WordPress 4.0+ 适用
  2. function qiniu_avatar($avatar) {
  3.   $avatar = preg_replace('/.*\/avatar\/(.*)\?s=([\d]+)&.*.srcset=.*/','<img src="http://这里要替换成你的七牛空间域名/avatar/$1-$2" class="avatar avatar-$2" height="$2" width="$2">',$avatar);
  4.   return $avatar;
  5. }
  6. add_filter( 'get_avatar', 'qiniu_avatar', 10, 3 );

记得要把你自己的七牛空间域名或者绑定的自定义域名在代码里填上,然后保存,浏览一下评论页面后,对评论头像地址进行验证是不是已经替换为七牛云空间缓存的图片了。这时登录七牛云可以看到空间里面已经缓存了头像图片了

 

最后就是体验博客载入速度了,如果你是七牛付费用户还可以给头像缓存的七牛空间开启融合 CDN ,这样头像调用会选择离你最近、速度最快的节点链接,这样就可以避免Gravatar被“墙”以来头像总是获取失败和载入龟速的尴尬了,也算是变相的给我们的 WordPress 提了速!话说也不知道啥时候 WordPress 才会考虑在国内架设服务器,但愿这个愿望可以实现。

一些问题

Gravatar 头像缓存到七牛后会造成用户更换头像后不能同步更新的问题,这个同步更新估计是没戏了,但我们可以通过设定 Gravatar 头像的缓存有效期来避免出现这样的尴尬,只需设定缓存 Gravatar 头像的七牛空间的“文件客户端缓存 maxAge”就可以了

 

文件客户端缓存 maxAge的值是以秒为单位的,为了方便大家根据不同情况设定不同的天数,下面直接给出不同天数对应的秒数,以方便大家填写:

  • 1天=86400秒
  • 3天=259200秒
  • 7天=604800秒
  • 10天=86400秒
  • 14天=1296000秒
  • 20天=1728000秒

为什么可以这样设定,这是因为前文讲到的缓存 Gravatar 头像的七牛存储空间镜像源是 Gravatar官方的https://secure.gravatar.com/服务器,七牛会重新拉取对应的头像图片的。

  • weinxin
  • weinxin
  • IT小天博客
  • 小天既不是大神,也不是技术大咖,喜欢折腾,喜欢代码的世界,喜欢分享自己的生活乐趣和学习经验,关注互联网发展,关注网站建设。
  • GitHub 微博 微信 球球Q 邮箱

发表评论

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

目前评论:2   其中:访客  1   博主  1

    • avatar 裕康网志 0

      谢谢博主的文章,已经用上了。

        • avatar 小天  博主 

          @裕康网志 不客气。有用就好。