Nginx之http_image_filter_module模塊使用

一、安裝

yum install gd-devel #安裝gd庫(kù)

檢查是否已安裝過(guò)，我是用的寶塔編譯默認(rèn)安裝的nginx1.21，默認(rèn)就已經(jīng)安裝了

nginx -V
企業(yè)微信截圖_16277194081145.png

有這個(gè)http_image_filter_module就是裝過(guò)了，直接可以用了

沒(méi)裝過(guò)需要手動(dòng)編譯安裝

./configure --prefix=/usr/local/nginx     \
--with-debug                            \
--with-http_stub_status_module          \
--with-http_ssl_module                  \
--with-http_realip_module               \
--with-http_image_filter_module         \
--with-pcre=../pcre-8.21                \
--add-module=../ngx_devel_kit-0.2.19    \
--add-module=../lua-nginx-module-0.9.8  \
--add-module=../echo-nginx-module       \
--add-module=../redis2-nginx-module     \
--add-module=../set-misc-nginx-module

二、配置

    location ~* (.*\.(jpg|gif|png))!(.*)!(.*)$ {
        set $width   $3;
        set $height  $4;
        rewrite "(.*\.(jpg|gif|png))(.*)$" $1;
    }

    location ~* /image/.*\.(jpg|gif|png)$ {
        root   /home/jfy/web/;
        #image_filter off;
        #image_filter test;
        #image_filter size;
        #image_filter rotate 90;
        image_filter resize $width $height;
        #image_filter crop 300 200;
        image_filter_buffer 10M;
        image_filter_interlace on;
        image_filter_jpeg_quality 95;
        image_filter_sharpen 100;
        image_filter_transparency on;
    }

功能配置參數(shù)參考

image_filter off;
#關(guān)閉模塊
 
image_filter test;
#確保圖片是jpeg gif png否則返415錯(cuò)誤
 
image_filter size;
#輸出有關(guān)圖像的json格式：例如以下顯示{ "img" : { "width": 100, "height": 100, "type": "gif" } } 出錯(cuò)顯示：{}
 
image_filter rotate 90|180|270;
#旋轉(zhuǎn)指定度數(shù)的圖像，參數(shù)能夠包括變量，單獨(dú)或一起與resize crop一起使用。
 
image_filter resize width height;
#按比例降低圖像到指定大小，公降低一個(gè)能夠還有一個(gè)用"-"來(lái)表示,出錯(cuò)415，參數(shù)值可包括變量，能夠與rotate一起使用，則兩個(gè)一起生效。
 
image_filter crop width height;
#按比例降低圖像比較大的側(cè)面積和還有一側(cè)多余的載翦邊緣，其他和rotate一樣。沒(méi)太理解
 
image_filter_buffer 10M;
#設(shè)置讀取圖像緩沖的最大大小，超過(guò)則415錯(cuò)誤。
 
image_filter_interlace on;
#假設(shè)啟用，終于的圖像將被交錯(cuò)。對(duì)于JPEG，終于的圖像將在“漸進(jìn)式JPEG”格式。
 
image_filter_jpeg_quality 95;
#設(shè)置變換的JPEG圖像的期望質(zhì)量?？山邮艿闹凳菑?到100的范圍內(nèi)。較小的值通常意味著既降低圖像質(zhì)量，降低數(shù)據(jù)傳輸，推薦的最大值為95。參數(shù)值能夠包括變量。
 
image_filter_sharpen 100;
#添加了終于圖像的清晰度。銳度百分比能夠超過(guò)100。零值將禁用銳化。參數(shù)值能夠包括變量。
 
image_filter_transparency on;
#定義是否應(yīng)該透明轉(zhuǎn)換的GIF圖像或PNG圖像與調(diào)色板中指定的顏色時(shí)，能夠保留。透明度的損失將導(dǎo)致更好的圖像質(zhì)量。在PNG的Alpha通道總是保留透明度。

三、幾個(gè)規(guī)則，可能實(shí)用。
匹配全站全部的結(jié)尾圖片

        location ~* \.(jpg|gif|png)$ {
            image_filter resize 500 500;
        }

匹配某個(gè)文件夾全部圖片

        location ~* /image/.*\.(jpg|gif|png)$ {
            image_filter resize 500 500;
        }

再比方用url來(lái)指定

        location ~* (.*\.(jpg|gif|png))!(.*)!(.*)$ {
            set $width      $3;
            set $height     $4;
            rewrite "(.*\.(jpg|gif|png))(.*)$" $1;
        }
 
        location ~* /image/.*\.(jpg|gif|png)$ {
            image_filter resize $width $height;
        }

http://172.16.18.114/image/girl.jpg!300!200
自己主動(dòng)將原圖縮放為300*200的尺寸

更多配置方案

nginx_image_filter 

http_image_filter_module

配置

第一種：

//官方配置
location /img/ {
    proxy_pass   http://backend;
    image_filter resize 150 100;
    image_filter rotate 90;
    error_page   415 = /empty;
}

location = /empty {
    empty_gif;
}

http://nginx.org/en/docs/http/ngx_http_image_filter_module.html#image_filter_webp_quality

第二種：

//裁剪圖片，不存儲(chǔ)硬盤(pán)
訪問(wèn) http://xxx.com/fanfan_11.jpg@100w_100h_75Q_r
http://xxx.com/fanfan.jpg@150w_100h_75Q_r
http://xxx.com/img/fanfan.jpg@11w_11_h_80Q_r

    # 等比縮放圖片
    location ~ (.+)\.(jpeg|JPEG|jpg|gif|png|JPG|GIF|PNG)@(\d+)w_(\d+)h_(\d+)Q_r$ {
        set $w $3; #寬
        set $h $4; #高
        set $q $5; #圖片質(zhì)量
        image_filter resize $w $h;
        image_filter_jpeg_quality $q;
        image_filter_buffer 5M;
        try_files $1.$2 /www/wwwroot/www_xiyuehui/www/profile/notfound.jpg;
    }
    # 裁剪圖片
    location ~ (.+)\.(jpeg|JPEG|jpg|gif|png|JPG|GIF|PNG)@(\d+)w_(\d+)h_(\d+)Q_c$ {
        set $w $3; #寬
        set $h $4; #高
        set $q $5; #圖片質(zhì)量
        image_filter crop $w $h;
        image_filter_jpeg_quality $q;
        image_filter_buffer 5M;
        try_files $1.$2 /www/wwwroot/www_xiyuehui/www/profile/notfound.jpg;
    }

第三種：

//保存在磁盤(pán)

訪問(wèn) 
http://xxx.com/image_filter/222.jpg@120w_120h_75Q_r
代理到
xxx.com/image-resize/image_filter/222.jpg?w=200&h=200&q=75

location ~ (.+)\.(jpeg|JPEG|jpg|gif|png|JPG|GIF|PNG)@(\d+)w_(\d+)h_(\d+)Q_([rc])$ {
    
    # 方便調(diào)試
    error_log  /usr/local/var/logs/nginx/xxx.com.imagefilter.error.log  debug;

    # 限制referer，防盜鏈
    # valid_referers xxx.com;#domain modify
    # if ($invalid_referer) {return 404;}
 
    set $w $3; #寬
    set $h $4; #高
    set $q $5; #圖片質(zhì)量
    set $type $6;
    set $image_path  $1.$2; #真實(shí)圖片地址
    set $cache_path  $1_$3w_$4h_$5Q_$6.$2;  #臨時(shí)文件地址
    if ($type = 'r') {
        set $type 'image-resize';
    }
    if ($type = 'c') {
        set $type 'image-crop';
    }
    set $image_uri  /$type$image_path?w=$w&h=$h&q=$q;
    if (-f $document_root$cache_path) {
        rewrite (.+)\.(jpg|gif|png)@(\d+)w_(\d+)h_(\d+)Q_([rc])$ $1_$3w_$4h_$5Q_$6.$2;
        break;
    }
    if (!-f $document_root$cache_path) {
        # proxy_pass http://$server_name.$image_uri;
        # 必須填寫(xiě)ip,填寫(xiě)域名的話，nginx在啟動(dòng)的時(shí)候會(huì)檢測(cè)域名，解析DNS,啟動(dòng)后，在修改域名的解析是不生效的
        # 實(shí)際上，本機(jī)填寫(xiě)域名報(bào)500不生效，估計(jì)是DNS設(shè)置不對(duì)，會(huì)在server下添加
        # resolver 127.0.0.1 valid=300s;
# 圖片端口不是80 需要配置端口
        proxy_pass http://127.0.0.1:8011$image_uri;
        break;
    }
    proxy_store $document_root$cache_path;
    proxy_store_access user:rw group:rw all:r;
    proxy_temp_path  /tmp/images;
    proxy_set_header Host $host;
    expires  10d; # 設(shè)置圖片過(guò)期時(shí)間10天
}
location ~ /image-resize(.+)\.(jpeg|JPEG|jpg|gif|png|JPG|GIF|PNG) {
    rewrite /image-resize(.+)\.(jpg|gif|png)$ $1.$2 break;
    image_filter resize $arg_w $arg_h;
    image_filter_jpeg_quality $arg_q;
    image_filter_buffer 5M;
    try_files $1.$2 /img/notfound.jpg;
}
location ~ /image-crop(.+)\.(jpeg|JPEG|jpg|gif|png|JPG|GIF|PNG) {
    rewrite /image-crop(.+)\.(jpg|gif|png)$ $1.$2 break;
    image_filter crop $arg_w $arg_h;
    image_filter_jpeg_quality $arg_q;
    image_filter_buffer 5M;
    try_files $1.$2 /img/notfound.jpg;
}

壓縮圖片存盤(pán)的完整參考

#BINDING-127.0.0.1-START
server
{
    listen 8011;
    server_name 127.0.0.1;
    root /www/wwwroot/www_xiyuehui/www/profile;

    # 壓縮圖片不存盤(pán)
    # # 等比縮放圖片
    # location ~ (.+)\.(jpeg|JPEG|jpg|gif|png|JPG|GIF|PNG)@(\d+)w_(\d+)h_(\d+)Q_r$ {
    #     set $w $3; #寬
    #     set $h $4; #高
    #     set $q $5; #圖片質(zhì)量
    #     image_filter resize $w $h;
    #     image_filter_jpeg_quality $q;
    #     image_filter_buffer 5M;
    #     try_files $1.$2 /www/wwwroot/www_xiyuehui/www/profile/notfound.jpg;
    # }
    # # 裁剪圖片
    # location ~ (.+)\.(jpeg|JPEG|jpg|gif|png|JPG|GIF|PNG)@(\d+)w_(\d+)h_(\d+)Q_c$ {
    #     set $w $3; #寬
    #     set $h $4; #高
    #     set $q $5; #圖片質(zhì)量
    #     image_filter crop $w $h;
    #     image_filter_jpeg_quality $q;
    #     image_filter_buffer 5M;
    #     try_files $1.$2 /www/wwwroot/www_xiyuehui/www/profile/notfound.jpg;
    # }
    # 壓縮圖片緩存存盤(pán)
    location ~ (.+)\.(jpeg|JPEG|jpg|gif|png|JPG|GIF|PNG)@(\d+)w_(\d+)h_(\d+)Q_([rc])$ {
      
      # 方便調(diào)試
      error_log  /www/wwwlogs/www.xiyuehui.online.imagefilter.error.log  debug;
  
      # 限制referer，防盜鏈
      # valid_referers xxx.com;#domain modify
      # if ($invalid_referer) {return 404;}
   
      set $w $3; #寬
      set $h $4; #高
      set $q $5; #圖片質(zhì)量
      set $type $6;
      set $image_path  $1.$2; #真實(shí)圖片地址
      set $cache_path  $1_$3w_$4h_$5Q_$6.$2;  #臨時(shí)文件地址
      if ($type = 'r') {
          set $type 'image-resize';
      }
      if ($type = 'c') {
          set $type 'image-crop';
      }
      set $image_uri  /$type$image_path?w=$w&h=$h&q=$q;
      if (-f $document_root$cache_path) {
          rewrite (.+)\.(jpeg|JPEG|jpg|gif|png|JPG|GIF|PNG)@(\d+)w_(\d+)h_(\d+)Q_([rc])$ $1_$3w_$4h_$5Q_$6.$2;
          break;
      }
      if (!-f $document_root$cache_path) {
          # proxy_pass http://$server_name.$image_uri;
          # 必須填寫(xiě)ip,填寫(xiě)域名的話，nginx在啟動(dòng)的時(shí)候會(huì)檢測(cè)域名，解析DNS,啟動(dòng)后，在修改域名的解析是不生效的
          # 實(shí)際上，本機(jī)填寫(xiě)域名報(bào)500不生效，估計(jì)是DNS設(shè)置不對(duì)，會(huì)在server下添加
          # resolver 127.0.0.1 valid=300s;
  
          proxy_pass http://127.0.0.1:8011$image_uri;
          break;
      }
      proxy_store $document_root$cache_path;
      proxy_store_access user:rw group:rw all:r;
      proxy_temp_path  /tmp/images;
      proxy_set_header Host $host;
      expires  10d; # 設(shè)置圖片過(guò)期時(shí)間10天
  }
  location ~ /image-resize(.+)\.(jpeg|JPEG|jpg|gif|png|JPG|GIF|PNG) {
      rewrite /image-resize(.+)\.(jpeg|JPEG|jpg|gif|png|JPG|GIF|PNG)$ $1.$2 break;
      image_filter resize $arg_w $arg_h;
      image_filter_jpeg_quality $arg_q;
      image_filter_buffer 5M;
      try_files $1.$2 /img/notfound.jpg;
  }
  location ~ /image-crop(.+)\.(jpeg|JPEG|jpg|gif|png|JPG|GIF|PNG) {
      rewrite /image-crop(.+)\.(jpeg|JPEG|jpg|gif|png|JPG|GIF|PNG)$ $1.$2 break;
      image_filter crop $arg_w $arg_h;
      image_filter_jpeg_quality $arg_q;
      image_filter_buffer 5M;
      try_files $1.$2 /img/notfound.jpg;
  }

    # access_log /www/wwwlogs/www.xiyuehui.online.log;
    # error_log  /www/wwwlogs/www.xiyuehui.online.error.log;
}
最后編輯于 ：
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成，瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點(diǎn)，簡(jiǎn)書(shū)系信息發(fā)布平臺(tái)，僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容