nginx利用image_filter動態產生縮圖

標籤：ima   ati   otf   --   shell   編譯   set   module   先來   

原文：http://www.open-open.com/lib/view/open1416193847945.html

 

"我現在是有些圖片需要產生縮圖，這個現在加了image_filter這個已經實現了，但我不知道怎麼樣才能訪問我上傳的原圖"

剛開始覺得也不太好弄，讓他用程式區處理，實際上稍微動腦筋分析一下也可以不修改程式實現動態產生縮圖且能夠訪問原圖。

前提是需要定好圖片的訪問規則。

先來看一下什麼是nginx的image filter模組。

HttpImageFilterModule用來裁剪過大的圖片到指定大小，是nginx內建模組，預設不會開啟
開啟HttpImageFilterModule需要在編譯要帶上參數 --with-http_image_filter_module

該模組主要有兩個指令：
文法: image_filter (test | size | resize width height | crop width height)
預設是: 無
可出現的上下文: location

該指令指定映像的轉化形式：

test - 測試回複是否是JPEG、GIF、或PNG圖片（不支援BMP等其他格式），出錯時返回415。
size - 返回圖片的JSON資料，比如:( "Img": ( "width": 100, "height": 100, "type": "gif"))
resize - 根據設定按比例得減小映像，比如100*100的圖片，而設定是50*25，減小後的圖片為25*25。如果你只想設定一個維度，可以用“-”代替。出錯時返回415。
crop - 根據設定按比例得減小映像，然後裁剪成跟設定一樣大小的圖片。比如100*100的圖片，而設定是50*25，減小後的圖片為50*50，Nginx會選取中間高度25的像素，形成50*25的圖片，所以圖片會有缺失。如果你只想設定一個維度，可以用“-”代替。出錯時返回415。

文法: image_filter_buffer size
預設值: image_filter_buffer 1M
可出現的位置: http, server, location

該指令設定單圖片緩衝的最大值，如果過濾的圖片大小超過緩衝大小，會報錯返回415。

現在開始時重點：

有了如上認識再配合locaiont、if、image_filter 就可以讓nginx動態產生縮圖了。

假設你的圖片位於/img目錄下

訪問縮圖方式

http://www.xxx.cn/img/9GUMJR7200AJ0003_90x90.jpg

訪問原圖方式

http://www.xxx.cn/img/9GUMJR7200AJ0003.jpg

添加如下配置到server上下文即可

        location ~* /img/(.+)_(\d+)x(\d+)\.(jpg|gif|png)$ {                        set $h $2;            set $w $3;            if ($h = "0") {                rewrite /img/(.+)_(\d+)x(\d+)\.(jpg|gif|png)$ /img/$1.$4 last;            }            if ($w = "0") {                rewrite /img/(.+)_(\d+)x(\d+)\.(jpg|gif|png)$ /img/$1.$4 last;            }            #根據給定的長寬產生縮圖            image_filter resize $h $w;            #原圖最大2M，要裁剪的圖片超過2M返回415錯誤，需要調節參數image_filter_buffer             image_filter_buffer 2M;                                                  #error_page  415              /img/notfound.jpg;            try_files /img/$1.$4  /img/notfound.jpg;        }        location ~* /img {                    }

nginx利用image_filter動態產生縮圖