0x01 前言

我网站的服务器在香港,而且图片很多,我们都知道通过CDN 能有效减少用户加载资源的时间。但使用Wordpress 的我并不想安装任何插件,我想许多网站编写人员也不想将地址手动改为CDN 地址。

我网站服务器都用上了mod_pagespeed ,其中有一个模块能批量检测输出地址并且改写为CDN 地址,在此之前还能将资源压缩优化。

0x02 准备

首先你要确认你的服务器已经安装有pagespeed 模块:

  1. nignx : ngx_pagespeed
  2. apache : mod_pagespeed

如果没有,你还可以通过以下链接参考我的pagespeed 安装过程:

编译安装apache2 & mod_pagespeed

nginx 1.9.10 编译安装 with ngx_lua_waf & pagespeed

0x03 配置pagespeed.conf

默认情况下,pagespeed 是不加载rewrite_domains 过滤器的,需要修改配置文件pagespeed.conf 手动添加此过滤器:

#Apache
ModPagespeedEnableFilters rewrite_domains

#Nginx
pagespeed EnableFilters rewrite_domains;

你还可以通过添加以下配置信息改写超链接,不过要确认你网站所有的超链接都能通过CDN 访问。:

#Apache
ModPagespeedDomainRewriteHyperlinks on

#Nginx
pagespeed DomainRewriteHyperlinks on;

0x04 配置站点信息

配置语法:

#Apache
ModPagespeedMapRewriteDomain cdn.example.com *example.com

#Nginx
pagespeed MapRewriteDomain cdn.example.com *example.com;

下面是将我所有静态资源的地址修改为CDN 的地址:

#apache
ModPagespeedMapRewriteDomain https://proj-org-cn.b0.upaiyun.com https://ngx.hk

#nginx
pagespeed MapRewriteDomain https://proj-org-cn.b0.upaiyun.com https://ngx.hk;

如果有多个域名需要修改,还可以像下面这样配置:

ModPagespeedMapRewriteDomain https://fonts.odin.org.cn https://fonts.googleapis.com,https://fonts.googleapis.com,fonts.googleapis.com
ModPagespeedMapRewriteDomain https://ajax.odin.org.cn https://ajax.googleapis.com,https://ajax.googleapis.com,ajax.googleapis.com

上面的配置将所有引用Google 公共库的资源地址改写为我的反向代理地址,如果你想知道怎样配置nginx 的反向代理,请点击下面的地址:

使用nginx 反向代理Google fonts & ajax 库

0x05 按需匹配修改

如果你没按上面的配置方式将所有超链接都添加到匹配中或者有不标准的链接方式,但又想通过pagespeed 和CDN 处理这些链接,那么你可以通过以下方法配置。

例如我的daisy 的网站:https://daisy.org.cn/ ,这里有段配置:

ModPagespeedUrlValuedAttribute li data-thumb image
ModPagespeedUrlValuedAttribute img data-lazysrc image

上面第一行的配置的意思是适配标签li 里属性data-thumb 的图片链接,并将其添加到改写和优化规则中。

上面第二行的配置的意思是适配标签img 里属性data-lazysrc 的图片链接,并将其添加到改写和优化规则中。

以下是修改后的代码,我将其它多余的属性都删掉了:

<li data-thumb="https://daisy-org-cn-.b0.upaiyun.com/wp-content/uploads/2016/04/IMG_0710-100x50.jpg.pagespeed.ce.0AGvGviatz.jpg">

<img data-lazysrc="https://daisy-org-cn-.b0.upaiyun.com/wp-content/uploads/2016/04/xIMG_0691.jpg.pagespeed.ic.LIE5x2ZDbG.webp">

具体语法是:

#Apache
ModPagespeedUrlValuedAttribute ELEMENT ATTRIBUTE CATEGORY

#Nginx
pagespeed UrlValuedAttribute ELEMENT ATTRIBUTE CATEGORY;

0x06 结语

pagespeed 一开始是Google 的一款免费CDN 服务,包含所有pagespeed 功能。在大概两年前Google 关闭了这项优秀的免费服务并将源码发布在网上。其实一直是开源的。

我有时间会一点一点地解释我的配置信息和实践过程中所遇到的问题。如果你有问题或发现我文中有误,请通过以下留言栏或邮件和我联系。