前言本教程主要針對Centos7環境,其他更多環境安裝教程,歡迎評論區補充說明。brotli兼容性http2.0兼容性截至今天(2023年1月8號)為止,在Centos7環境中使用yum一鍵安裝nginx最新穩定版(nginx-1.22.1)已經內置gzip靜態壓縮,但是還是不支持brotli壓縮。目前主流瀏覽器均已支持http2.0以及brotli壓縮,接下來我來教大傢使用nginx開啟http2.0以及brotli壓縮提升網站加載速度。安裝下載工具yum install -y wget git安裝編譯工具以及庫yum -y install make zlib zlib-devel gcc-c++ libtool openssl openssl-devel下載Nginx、pcre 源碼相比較《nginx 源碼安裝並開啟gzip靜態壓縮》這篇教程,這裡我使用瞭shell並行執行命令nginx源碼使用國內鏡像提升下載速度。註意:nginx、pcre、ngx_brotli源碼必須在同一級目錄下!wget https://netix.dl.sourceforge.net/project/pcre/pcre/8.45/pcre-8.45.tar.gz & wget https://mirrors.huaweicloud.com/nginx/nginx-1.22.1.tar.gz & wait解壓Nginx、pcre源碼串行執行shell命令,可以直接復制以下所有代碼並執行。tar -xvf nginx-1.22.1.tar.gz;tar -xvf pcre-8.45.tar.gz下載ngx_brotli源碼串行執行shell命令,可以直接復制以下所有代碼並執行。git clone https://gitee.com/eagle_0810/ngx_brotli.git &&
cd ./ngx_brotli &&
git submodule update –init 安裝編譯nginx安裝目錄指定 /usr/local/webserver/nginx同時支持gzip靜態壓縮模塊串行執行shell命令,可以直接復制以下所有代碼並執行。cd nginx-1.22.1 &&
./configure –prefix=/usr/local/webserver/nginx –conf-path=/usr/local/webserver/nginx/conf/nginx.conf –error-log-path=/usr/local/webserver/nginx/logs/error.log –http-log-path=/usr/local/webserver/nginx/logs/access.log –pid-path=/usr/local/webserver/nginx/run/nginx.pid –with-http_stub_status_module –with-http_ssl_module –with-pcre=/pcre-8.45 –with-http_gzip_static_module –with-stream –with-http_v2_module –add-module=./ngx_brotli &&
make &&
make install測試是否安裝成功/usr/local/webserver/nginx/sbin/nginx -V設置http2.0以及brotli壓縮推薦添加到server模塊中。註意:必須開啟https,配置ssl證書!可以使用openssl生成永久免費證書。listen 80;
# 開啟 https、http2.0
listen 443 ssl http2;
server_name test.jincheny.com;
# SSL配置
ssl_certificate /ssl/private.crt;
ssl_certificate_key /ssl/private.key;
ssl_session_cache shared:SSL:1m;
ssl_session_timeout 5m;
ssl_ciphers HIGH:!aNULL:!MD5;
ssl_prefer_server_ciphers on;
# 開啟gzip靜、動態壓縮
gzip_static on;
gzip_http_version 1.1;
gzip_proxied expired no-cache no-store private auth;
gzip on;
gzip_min_length 1k;
gzip_vary on;
gzip_disable "MSIE [1-6]\.";
gzip_types text/plain application/javascript application/x-javascript text/javascript text/xml text/css;
gzip_comp_level 4;
gzip_buffers 4 16k;
# 開啟brotli靜、動態壓縮
brotli_static on;
brotli on;
brotli_comp_level 6;
brotli_buffers 16 8k;
brotli_min_length 1k;
brotli_types text/plain text/css application/json application/x-javascript text/xml application/xml application/xml+rss text/javascript application/javascript image/svg+xml;驗證上傳帶有brotli壓縮後的前端源碼,ETag顯示如下圖展示,則表示已經成功開啟brotli靜態壓縮,ETag帶有W/表示開啟brotli動態壓縮,另外協議上顯示HTTP/2表示http2.0配置成功。