阿里云宝塔面板nginx安装pagespeed模块

阿里云宝塔面板nginx安装pagespeed模块

系统运维Git开源网2020-03-08 12:24:39199A+A-

Ngx_PageSpeed简介:

ngx_pagespeed是一个开源的Nginx扩展模块,由Google创建,通过重写网页来减少延迟和带宽,从而帮助提高Web速度,主要的功能是针对前端页面而进行服务器端的优化,对前端设计人员来说,可以省去优化css、js以及图片的过程。当然,网上有的说“Ngx_PageSpeed对Nginx自身负载能力的提升基本是看不到的,甚至会因为进行服务器端的优化而使系统增加负载,但从减少客户请求数的角度去看,牺牲部分服务器性能还是值得的。”

由于这里是通过阿里云的宝塔面板来操作,宝塔面板默认已经支持了ngx_pagespeed,只是在Nginx.sh安装配置中没有启用ngx_pagespeed扩展的安装。

PageSpeed模块的功能有哪些呢?

  • 图像优化:剥离元数据、动态调整,重新压缩

  • CSS和JavaScript压缩、合并、级联、内联

  • 小资源内联

  • 推迟图像和JavaScript加载

  • 对HTML重写、压缩空格、去除注释等

  • 提升缓存周期

如何编译安装ngx_pagespeed?这里宝塔版本是7.1.1

1、宝塔面板找到路径:/www/server/panel/install,找到nginx.sh文件,当然如有必要你可以先对其进行更新。

更新nginx.sh命令:wget http://download.bt.cn/install/0/nginx.sh

2、打开nginx.sh文件,约246行找到增加代码 --add-module=${Setup_Path}/src/ngx-pagespeed ,去掉 ${ENABLE_NGX_PAGESPEED}

如下图:

0.jpg

修改后:

1.jpg


3、编译安装Nginx,安装前卸载旧版本,然后编译安装,可以在宝塔软件管理中安装,也可以在SSH中执行命令“ sh /www/server/panel/install/nginx.sh install 1.17 ”。

注意:pagespeed的编译对gcc有一定要求,更新gcc命令“ yum -y install gcc gcc-c++ autoconf automake ”。

这里遇到了错误:

2-1-error.jpg

./configuer/:error:can not define uint32_t

make: *** No rule to make target `build', needed by `default'. Stop.

问题是之前阿里云CentOS改了核心为bbrplus,导致头文件模块丢失,更新yum即可,执行命令“ yum update ”。

更新yum后,检查一下nginx.sh是否是更改后的。然后继续命令编译安装Nginx“ sh /www/server/panel/install/nginx.sh install 1.17 ”。

2-2.jpg

编译安装Nginx完毕后,检查一下nginx模块是否含有pagespeed,命令“ /www/server/nginx/sbin/nginx -V ”。

2-3.jpg


4、在Nginx网站配置文件中添加pagespeed配置代码:修改项目conf文件,放到server里面就行,如果不知道加到哪,可以加入到 root /www/wwwroot/yourdomain.com;后面即可.

3.jpg


关于pagespeed配置代码:

        pagespeed on;
        pagespeed EnableCachePurge on;
        pagespeed FileCachePath /var/cache/ngx_pagespeed;
        pagespeed FileCacheSizeKb 102400;
        pagespeed FileCacheCleanIntervalMs 3600000;
        pagespeed FileCacheInodeLimit 500000;

        # 禁用 CoreFilters
        pagespeed RewriteLevel PassThrough;
        # 图像延迟加载
        pagespeed EnableFilters lazyload_images;
        pagespeed LazyloadImagesBlankUrl "//static.youfencun.com/1.gif";
        # 不加载显示区域以外的图片
        pagespeed LazyloadImagesAfterOnload off;
        pagespeed CriticalImagesBeaconEnabled false;
        # 图片预加载
        pagespeed EnableFilters inline_preview_images;
        # 移动端图片自适应重置
        pagespeed EnableFilters resize_mobile_images;
        # 自动将多张背景图片合并成一张图片
        pagespeed EnableFilters sprite_images;
        # srcset 图像优化
        pagespeed EnableFilters responsive_images;
        # css 格式改成.css 文件并缓存
        #pagespeed EnableFilters outline_css;
        # js 格式改成.js 文件并缓存
        #pagespeed EnableFilters outline_javascript;
        # 移动 script 标签上方的 CSS 元素
        pagespeed EnableFilters move_css_above_scripts;
        # 将 CSS 元素移动到 head 中
        pagespeed EnableFilters move_css_to_head;
        # 将多个 css 文件合并成一个
        pagespeed EnableFilters combine_css;
        # 重写 CSS 以精简优化
        pagespeed EnableFilters rewrite_css;
        # 重写任何 CSS 文件中引用的资源
        pagespeed EnableFilters fallback_rewrite_css_urls;
        # 优化内嵌样式属性
        pagespeed EnableFilters rewrite_style_attributes;
        # CSS 的 URL 重置
        pagespeed EnableFilters rewrite_style_attributes_with_url;
        # 更换被导入文件的@import,精简 CSS 文件
        pagespeed EnableFilters flatten_css_imports;
        # 重写 CSS,首先加载渲染页面的 CSS 规则
        pagespeed EnableFilters prioritize_critical_css;
        # google 字体直接写入 html 目的是减少浏览器请求和 DNS 查询
        pagespeed EnableFilters inline_google_font_css;
        # 启用 JavaScript 缩小机制
        pagespeed EnableFilters rewrite_javascript;
        # 把多个 JavaScript 文件合并成一个 JavaScript 文件
        pagespeed EnableFilters combine_javascript;
        # 将小 JS 文件插入到 HTML 文档中
        pagespeed EnableFilters inline_javascript;
        # 将小 CSS 文件插入到 HTML 文档中
        pagespeed EnableFilters inline_css;
        # 启用图片优化机制
        pagespeed EnableFilters rewrite_images;
        # 将 JPEG 转换为渐进式
        pagespeed EnableFilters convert_jpeg_to_progressive;
        # 内联图像
        pagespeed EnableFilters inline_images;
        # 减少 JPEG 次采样
        pagespeed EnableFilters jpeg_subsampling;
        # 删除 HTML 的注释
        pagespeed EnableFilters remove_comments;
        # 启用压缩空白过滤器,删除 HTML 的空白
        pagespeed EnableFilters collapse_whitespace;
        # 删除带默认属性的标签
        pagespeed EnableFilters elide_attributes;
        # 改善 CSS 及 JS 及图像的可缓存性
        pagespeed EnableFilters extend_cache;
        # 改善资 PDF 的可缓存性
        pagespeed EnableFilters extend_cache_pdfs;
        # 预解析 DNS 查询
        pagespeed EnableFilters insert_dns_prefetch;
        # meta 使用 http-equiv 属性 为每个标签 添加一个响应头
        pagespeed EnableFilters convert_meta_tags;
        # 延迟加载 js
        #pagespeed EnableFilters defer_javascript;
        # 使用 JavaScript 从第一次出现图像加载图像替换重复的内联图像
        pagespeed EnableFilters dedup_inlined_images;
        # 资源预加载
        #pagespeed EnableFilters hint_preload_subresources;
        # 禁止 pagespeed 处理/wp-admin/目录
        pagespeed Disallow "*/wp-admin/*";
        pagespeed Disallow "*/wp-login.php*";
        # 禁止 pagespeed 处理/wp-default/目录
        pagespeed Disallow "*/wp-default/*";
        # 配置 Memcached 支持
        pagespeed MemcachedServers "127.0.0.1:11211";
        # 移除不必要的 url 前缀,开启可能会导致某些自动加载功能失效
        pagespeed EnableFilters trim_urls;
        # 补全 script 和 style 的 type 标签
        pagespeed EnableFilters pedantic;
        # 按照合适的格式和尺寸展示图片
        pagespeed EnableFilters resize_rendered_image_dimensions;
        # 保存原始的 HTML 缓存头 不使用默认的 Cache-Control no-cache max-age=0
        #pagespeed ModifyCachingHeaders off;

        # 配置网页版后台
        pagespeed AdminPath /pagespeedwpadmin;
        pagespeed StatisticsLogging on;
        pagespeed LogDir /tmp/cache/log/pagespeed;
        location ~ ^/pagespeedwpadmin {
        auth_basic "Authorized users only";
        auth_basic_user_file /usr/local/nginx/conf/pass.db;
        }

        # 将 meta 转换为 header
        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_message { allow 127.0.0.1; deny all; }
        # 扩展缓存
        location /mod_pagespeed_example {
        location ~* \.(jpg|jpeg|gif|png|js|css)$ {add_header Cache-Control "public, max-age=31536000";}}


参考链接:

https://www.bt.cn/bbs/thread-12990-1-2.html

https://www.youfencun.com/74.html

https://blog.csdn.net/qq_40961831/article/details/85265738

https://www.miaoroom.com/course/baota-nginx_pagespeed.html

https://www.daniao.org/6521.html

https://fatesinger.com/100189


点击这里复制本文地址 以上内容由Git开源网整理呈现,请务必在转载分享时注明本文地址!如对内容有疑问,请联系我们,谢谢!

支持Ctrl+Enter提交

Git开源网_git开源代码资源网_git开源博客 © All Rights Reserved.  
文章中出现的商标及图像版权属于其合法持有人,只供传递信息之用,非商务用途。本站所上传资源,只用于交流学习所用。本站资源收集于网络以及网友投稿,其版权归原创者所有,如有侵害到你的权益,或有不妥之处,请联系我们删除,敬请谅解。Email:admin#gitoscc.com(#更换成@)
Copyright © Git开源网 All rights reserved. 黑ICP备18006154号-1 由ZBlog驱动

网站管理