Nginx的 http_image_filter_module 模組使用說明

gary-liu發表於2017-02-17
NginxHTTPFilter

Nginx圖片處理原理

這裡需要用到 nginx的 http_image_filter_module 模組，這個模組可以很方便的實現圖片縮放功能，只是預設的情況下並不會安裝，需要自己編譯安裝才能行。編譯的時候./configure 增加 –with-http_image_filter_module 編譯安裝即可

Nginx圖片處理的優缺點

優點

  1. 操作簡單。通過簡單配置，省去了後端裁剪程式的複雜性。
  2. 實時裁剪。可以實時訪問線上裁剪圖片。
  3. 靈活性強。後端程式裁剪圖片時需要知道裁剪圖片的尺寸和質量，使用nginx裁剪可以實時裁剪任意尺寸的圖片。
  4. 不佔用硬碟空間。

缺點

  1. 消耗CPU和記憶體，訪問量大的時候就會給伺服器帶來很大的負擔。(可以通過使用Nginx快取和快取伺服器來解決)

  2. 功能不是很強大，支援的處理圖片型別只包括JPEG, GIF, PNG, or WebP

Nginx圖片處理模組指令使用

image_filter （重要）

設定要在影像上執行的轉換型別

Syntax: image_filter off;
image_filter test;
image_filter size;
image_filter rotate 90/180/270;
image_filter resize width height;
image_filter crop width height;
Default: image_filter off;
Context: location

test

確保響應圖片是JPEG、GIF，WEBP或PNG格式，否則返回415錯誤碼。

size

outputs information about images in a JSON format, e.g.:

{ "img" : { "width": 100, "height": 100, "type": "gif" } }

In case of an error, the output is as follows:

{}

以 json 格式返回原圖的尺寸和型別

rotate

逆時針旋轉指定角度，只能指定這三個角度。引數值可以包含變數，這個模式可以單獨使用也可以和resize、crop變換同時使用。

resize width height

按比例對影像進行縮放，可以只指定一個尺寸，另一個尺寸用“-”。如果遇到錯誤，伺服器返回415錯誤碼。引數值可以包含變數。當與rotate引數一同使用時，旋轉操作發生在縮放之後。圖片會以長的一邊為標準，然後等比縮放。

crop width height

按比例裁剪圖片，可以只指定一個尺寸，另一個尺寸用“-”。如果遇到錯誤，伺服器返回415錯誤碼。引數值可以包含變數。當與rotate引數一同使用時，旋轉操作發生在裁剪之前。圖片會以長的一邊為標準，然後等比縮放，然後裁剪掉多餘的部分。

image_filter_buffer

設定用於讀取影像的緩衝區的最大大小

Syntax: image_filter_buffer size;
Default: image_filter_buffer 1M;
Context: http, server, location

設定讀取圖片的最大緩衝區大小。當超過緩衝區大小時，返回 error 415 (Unsupported Media Type).

image_filter_interlace

如果啟用，最終影像將隔行掃描

Syntax: image_filter_interlace on / off;
Default: image_filter_interlace off;
Context: http, server, location

如果開啟此功能，最終的影像是交錯的。對於JPEG，最終圖片是“漸進式JPEG”格式。圖片一般是線性載入，設定後則變為交替載入圖片。漸進式jpeg效果參見：http://www.zhangxinxu.com/wordpress/2013/01/progressive-jpeg-image-and-so-on/

image_filter_jpeg_quality

設定轉換JPEG影像的質量

Syntax: image_filter_jpeg_quality quality;
Default: image_filter_jpeg_quality 75;
Context: http, server, location

設定轉為JPEG影像的質量。接受的值從1到100。較小的值意味著低質的圖片質量和更少的資料傳輸量。最大建議的值是95。引數可以包含變數。

image_filter_sharpen

通過設定銳化度，增加最終影像的清晰度。

Syntax: image_filter_sharpen percent;
Default: image_filter_sharpen 0;
Context: http, server, location

增加最終圖片的銳度。這個百分比可以超過100。0值禁用此功能。引數可以包含變數。

image_filter_transparency

定義是否透明度時應保留轉換GIF影像或PNG影像的調色盤中指定的顏色。

Syntax: image_filter_transparency on/off;
Default: image_filter_transparency on;
Context: http, server, location

決定在轉換GIF或PNG圖片帶有調色盤定義的顏色時，透明是否會保留。丟失透明度可以是圖片得到更好的質量。PNG的Alpha通道的透明總是會保留。

image_filter_webp_quality

設定轉化WebP影像所需的質量

Syntax: image_filter_webp_quality quality;
Default: image_filter_webp_quality 80;
Context: http, server, location

設定轉為webp影像的質量。

This directive appeared in version 1.11.6.

侷限性

  1. Nginx 的圖片處理模組，暫時沒有看到官方釋出的能夠給圖片加水印功能的模組，在github上看到有人寫了些這樣的擴充套件功能，參見 https://github.com/3078825/ngx_image_thumb

  2. Nginx 的實時性和訪問的方便性上，GraphicsMagick 是無法比擬的，但是 GraphicsMagick 對圖片的處理的功能要比nginx強大很多，比如nginx不能將圖片旋轉任意角度，不能在圖片上加水印，處理圖片型別有限等，相對nginx，GraphicsMagick 更適合對圖片的非同步處理。

參考文獻

Module ngx_http_image_filter_module

相關文章