nginx 配置 ngx_pagespeed

pagespeed（GitHub）是 Goolge 为 Apache 和 nginx 开发的前端优化扩展模块，其中适用 Apache 环境的叫 mod_pagespeed，适用于 nginx 环境的叫 ngx_pagespeed。

pagespeed 功能简介

pagespeed 的功能包括但不限于以下方面：
优化传输带宽（过滤）（压缩图片、CSS、JS文件，去除html空白、注释...）、降低请求（CSS、JS文件合并、图片雪碧、识别并重定向常用JS库、缓存控制）、域名映射（支持CDN）、提升客户端体验（图片预加载、延迟加载，移动端图像优化），同时还提供对 https 的支持。

nginx 下 pagespeed 的编译安装

安装方法 Google pagespeed 网站上有详细介绍，复制过来方便不能翻墙的朋友查看。

安装依赖

RedHat, CentOS, or Fedora

sudo yum install gcc-c++ pcre-devel zlib-devel make unzip libuuid-devel

Ubuntu or Debian

sudo apt-get install build-essential zlib1g-dev libpcre3 libpcre3-dev unzip uuid-dev

下载 ngx_pagespeed

目前 ngx_pagespeed 最新的版本是 1.13.35.2-stable（需要 gcc ≥ 4.8 或者 clang ≥ 3.3，如果不符合要求请升级 gcc 或 clang，或者继续使用旧版：1.9.32.11），想使用其它版本直接用新版本号替换掉下面的 1.13.35.2-stable 即可。

#[check the release notes for the latest version]
NPS_VERSION=1.13.35.2-stable
cd
wget https://github.com/apache/incubator-pagespeed-ngx/archive/v${NPS_VERSION}.zip
unzip v${NPS_VERSION}.zip
nps_dir=$(find . -name "*pagespeed-ngx-${NPS_VERSION}" -type d)
cd "$nps_dir"
NPS_RELEASE_NUMBER=${NPS_VERSION/beta/}
NPS_RELEASE_NUMBER=${NPS_VERSION/stable/}
psol_url=https://dl.google.com/dl/page-speed/psol/${NPS_RELEASE_NUMBER}.tar.gz
[ -e scripts/format_binary_url.sh ] && psol_url=$(scripts/format_binary_url.sh PSOL_BINARY_URL)
wget ${psol_url}
tar -xzvf $(basename ${psol_url})  # extracts to psol/

下载 nginx 并编译 ngx_pagespeed 模块

编译 ngx_pagespeed 模块分两种情况：1、全新安装；2、当前版本添加。

1、全新安装 nginx 并加入 ngx_pagespeed 模块

下面是全新安装 nginx 1.16.1，改成需要的版本即可。

cd
NGINX_VERSION=1.16.1
cd
wget http://nginx.org/download/nginx-${NGINX_VERSION}.tar.gz
tar -xvzf nginx-${NGINX_VERSION}.tar.gz
cd nginx-${NGINX_VERSION}/
./configure --add-module=$HOME/ngx_pagespeed-${NPS_VERSION} ${PS_NGX_EXTRA_FLAGS}
make
sudo make install
2、当前版本添加 ngx_pagespeed 模块

如果当前服务器已经安装了 nginx 则需要先查看当前的 nginx 版本号：
nginx -V

确定了当前服务器的 nginx 版本号，即可使用下面的代码编译安装了，./configure 中的 module 请根据需要进行配置：

NGINX_VERSION=1.16.0
wget http://nginx.org/download/nginx-${NGINX_VERSION}.tar.gz
tar -xvzf nginx-${NGINX_VERSION}.tar.gz
cd nginx-${NGINX_VERSION}/
./configure --user=www --group=www --prefix=/usr/local/nginx --with-http_stub_status_module --with-http_ssl_module --with-http_gzip_static_module --with-ipv6 --with-http_sub_module --add-module=/root/incubator-pagespeed-ngx-1.13.35.2-stable
make
sudo make install

配置 ngx_pagespeed

配置用的过滤参数这里有详细说明：http://ngxpagespeed.com/

创建配置文件

在 /usr/local/nginx/conf/ 添加 pagespeed 配置文件：
vi /usr/local/nginx/conf/pagespeed.conf
根据实际需求加入类似下面的配置参数：

		# on 启用，off 关闭
		pagespeed on;
		# 重置 http Vary 头
		pagespeed RespectVary on;
		# html字符转小写
		pagespeed LowercaseHtmlNames on;
		# 压缩带 Cache-Control: no-transform 标记的资源
		#pagespeed DisableRewriteOnNoTransform off;
		# 相对URL
		#pagespeed PreserveUrlRelativity on;
		pagespeed XHeaderValue "Powered By ngx_pagespeed";
		
		# 开启 https
		#pagespeed FetchHttps enable;
		
		# 配置服务器缓存位置和自动清除触发条件（空间大小、时限）
		pagespeed FileCachePath "/var/ngx_pagespeed/";
		pagespeed FileCacheSizeKb 2048000;
		pagespeed FileCacheCleanIntervalMs 43200000;
		pagespeed FileCacheInodeLimit 500000;
		# 过滤规则
		pagespeed RewriteLevel PassThrough;
		# 不需过滤的目录或文件
		pagespeed Disallow "*/wp-admin/*";
		pagespeed Disallow "*/wp-login.php*";
		
		# 移除不必要的url前缀，开启可能会导致某些自动加载功能失效
		#pagespeed EnableFilters trim_urls;
		# 移除 html 空白
		pagespeed EnableFilters collapse_whitespace;
		# 移除 html 注释
		pagespeed EnableFilters remove_comments;
		# DNS 预加载
		pagespeed EnableFilters insert_dns_prefetch;
		# 压缩CSS
		pagespeed EnableFilters rewrite_css;
		# 合并CSS
		pagespeed EnableFilters combine_css;
		# 重写CSS，优化加载渲染页面的CSS规则
		pagespeed EnableFilters prioritize_critical_css;
		# google字体直接写入html 目的是减少浏览器请求和DNS查询
		pagespeed EnableFilters inline_google_font_css;
		# 压缩js
		pagespeed EnableFilters rewrite_javascript;
		# 合并js
		pagespeed EnableFilters combine_javascript;
		
		#pagespeed EnableFilters rewrite_style_attributes;
		# 压缩图片
		#pagespeed EnableFilters rewrite_images;
		# 不加载显示区域以外的图片
		pagespeed LazyloadImagesAfterOnload off;
		# 图片预加载
		pagespeed EnableFilters inline_preview_images;
		# 移动端图片自适应重置
		pagespeed EnableFilters resize_mobile_images;
		# 图片延迟加载
		pagespeed EnableFilters lazyload_images;
		# 雪碧图片，图标很多的时候很有用
		#pagespeed EnableFilters sprite_images;
		# 扩展缓存 改善页面资源的可缓存性
		pagespeed EnableFilters extend_cache;
		# 不将规则应用在 wp-admin目录 和 wplogin.php页面
		pagespeed Disallow "*/wp-admin/*";
		pagespeed Disallow "*/wp-login.php*";

		
		# 风险指数高，不建议开启
		#pagespeed EnableFilters local_storage_cache;
		# 不能删
		location ~ "\.pagespeed\.([a-z]\.)?[a-z]{2}\.[^.]{10}\.[^.]+" {
			add_header "" "";
			}
		
		location ~ "^/ngx_pagespeed_static/" { }
		location ~ "^/ngx_pagespeed_beacon$" { }
		location /ngx_pagespeed_statistics {
			allow 127.0.0.1;
			deny all;
			}
		location /ngx_pagespeed_global_statistics {
			allow 127.0.0.1;
			deny all;
			}
		location /ngx_pagespeed_message {
			allow 127.0.0.1;
			deny all;
			}
		location ~ ^/pagespeed_global_admin {
			allow 127.0.0.1;
			deny all;
			}
		
		pagespeed StatisticsPath /ngx_pagespeed_statistics;
		pagespeed MessagesPath /ngx_pagespeed_message;
		pagespeed ConsolePath /pagespeed_console;
		pagespeed AdminPath /pagespeed_admin;
		
		# 控制台 可通过 http://domain.com/ngx_pagespeed_admin 来查看控制台
		pagespeed Statistics on;
		pagespeed StatisticsLogging on;
		pagespeed LogDir /var/log/pagespeed;
		location /pagespeed_console {
			allow 127.0.0.1;
			deny all;
			}
		pagespeed AdminPath /ngx_pagespeed_admin;
		
		location ~ ^/pagespeed_admin {
			allow 127.0.0.1;
			deny all;
		}
		# 日志限制
		pagespeed StatisticsLoggingIntervalMs 60000;
		pagespeed StatisticsLoggingMaxFileSizeKb 1024;

按ESC键，输入:wq保存并退出。

引入 pagespeed 到网站配置文件

打开网站的配置文件,如：
vi /usr/local/nginx/conf/vhost/nanshanxia.com.conf
按i加入
include pagespeed.conf;，最后再ESC:wq保存退出。

检查 nginx 配置

/usr/local/nginx/sbin/nginx -t
返回

nginx: the configuration file /usr/local/nginx/conf/nginx.conf syntax is ok
nginx: configuration file /usr/local/nginx/conf/nginx.conf test is successful

说明没有问题。

重启 nginx 使 pagespeed 生效

接着重启 nginx 让 pagespeed 生效
service nginx restart

验证 pagespeed 是否生效

使用 curl 验证 pagespeed 是否生效：
curl -I 'http://maliyana.com' | grep X-Page-Speed

然后再访问网站，速度就有提升了。

启用 pagespeed 后 WP Super Cache 这个插件基本就没什么作用了，所以，又可以减掉一个插件了。

发表评论

评论(2)

  1. Betty

    据说多用一个插件就是在服务器多开一个后门，还增加服务器压力
    一般情况下都是能不用插件就不用插件吧。

    Reply
    1. Shrek

      @Betty 嗯 目前还有四个插件

      Reply