前言

在做很多系統的時候，我們可能都有這樣的需求：

在CMS中只維護一張圖片，而這張圖片在網站的很多地方都需要顯示，而且顯示的大小不同。

一般做法就是直接使用這張圖片，在不同的地方使用 width 和 height 設定圖片的顯示大小。

場景需求

一般情況下這樣做其實就可以了。如下這個場景，如果通過這樣做，可能就不太合適了。

場景：CMS 有個海報管理功能，每個大的海報都是一張 1000*2000px 的圖片，而且對海報的清晰度有一定的要求，質量不能太差，假定一個海報有 1MB。

然後在網站上有一個海報列表，每頁顯示20個海報。

這種情況下如果我們還用一張圖片，通過 width 和 height 來設定圖片顯示大小的話，那就太不合適了，一個列表頁面下來，20多MB沒有了。頁面顯示肯定會很慢。

解決思路

我們一般的做法有：

1、在CMS中上傳一個海報大圖，再上傳一個海報小圖。

2、在CMS中上傳一個海報大圖，儲存的時候，系統自動生成一個海報小圖。

3、在CMS中上傳一個海報大圖，在網頁請求圖片的時候，附帶需求圖片的 width 和 height，程式自動判斷需求圖片是否存在，如果不存在則使用對應的大圖生成一個圖片響應到客戶端。

上面三種做法，1、2 兩種情況不夠靈活，如果系統還有更多地方需要顯示不同尺寸的這樣的圖片呢？或者系統二期、三期……擴充套件的時候也有可能有更多尺寸的圖片需求呢？

至於第三種方法，相對比較靈活，只有在我們需要的時候才生成。

我們現在需要使用 Apache 來處理我們的靜態圖片資源。一般情況下 Apache 可不會去管你的圖片存在不存在，當我們訪問一個新的尺寸圖片時，伺服器上不存在圖片檔案，Apache 就直接響應404了。

現在我們要做的就是，讓Apache 來判斷檔案是否存在，如果檔案不存在就轉而請求我們生成圖片的請求。

這樣以來，每個尺寸的圖片，在需求的時候，第一次 Apache 會交給我們的程式去生成圖片，以後這個圖片存在了，就全部由Apache 自己管理了。

Apache 配置

下面來說一下 Apache 怎麼配置，來實現 “當檔案不存在的時候，轉發請求到處理程式”。

1、開啟 rewrite 模組

      去除httpd.conf檔案中 #LoadModule rewrite_module modules/mod_rewrite.so 前面的"#"號

2、在 httpd.cnf 中增加配置（沒有位置要求，一般我們放在檔案最後即可）

      我是用的是 apache 2.4 的 VirtualHost ，圖片處理程式是用的 Tomcat，所以也給Apache 添加了mod_jk 模組（這個本文不做講解，可以檢視帖子 http://blog.csdn.net/catoop/article/details/47974773）

      需要新增的配置內容為：

        <IfModule mod_rewrite.c>
                RewriteEngine On
                # '-s' (is regular file, with size)
                # '-l' (is symbolic link)
                # '-d' (is directory)
                # 'ornext|OR' (or next condition)
                # 'nocase|NC' (no case)
                # 'last|L' (last rule)
                # 'QSA' 追加請求字串

                RewriteCond %{DOCUMENT_ROOT}%{REQUEST_FILENAME} !-s
                RewriteCond %{DOCUMENT_ROOT}%{REQUEST_FILENAME} !-l 
                RewriteCond %{DOCUMENT_ROOT}%{REQUEST_FILENAME} !-f

                #RewriteRule ^(.*)\.[jpg|png|bmp]$ %{HTTP_HOST}/createimage.jsp?path=%{REQUEST_URI} [NC,L]
                #RewriteRule ^(.*)\.(jpg|png|bmp)$ createimage.jsp?path=%{REQUEST_URI} [NC,L]
                RewriteRule ^(.*)\.(jpg|png|bmp)$ http://shanhyweb.example.com/createimage.jsp?path=%{REQUEST_URI} [NC,L]
                #RewriteRule ^(.*)\.(jpg|png|bmp)$ /createimage.jsp?path=%{REQUEST_URI} [NC,L]

        </IfModule>

      配置可以直接在 httpd.cnf 中新增，也可以在 VirtualHost  中配置，因為我使用的是 VirtualHost 所以我的配置是在 apache2/conf/extra/httpd-vhosts.conf 中，如下：

########################################################
LoadModule jk_module modules/mod_jk.so
Include conf/mod_jk.conf
########################################################
<VirtualHost *:80>
    #ServerAdmin [email protected]
    DocumentRoot "/svcroot/runtime/webstatic/shanhyweb"
    ServerName shanhyweb.example.com
    #ServerAlias www.shanhyweb.example.com
    ErrorLog "logs/shanhyweb-error_log"
    CustomLog "logs/shanhyweb-access_log" common
        <IfModule mod_jk.c>
                #日誌輸出檔案(其他配置也可以重寫mod_jk.conf裡面的配置)
                JkLogFile logs/mod_jk_shanhyweb.log
                #指URL指向如果有servlet，則讓worker_web去處理
                JkMount /servlet/* worker_web
                #指URL為/*.jsp的頁面，讓worker_web去處理
                JkMount /*.jsp worker_web
                #指URL為/*.do的頁面，讓worker_web去處理
                JkMount /*.do worker_web
                #指URL為/*.json的頁面，讓worker_web去處理
                JkMount /*.json worker_web
        </IfModule>

	<IfModule mod_rewrite.c>
		RewriteEngine On
		# '-s' (is regular file, with size) 
		# '-l' (is symbolic link) 
		# '-d' (is directory) 
		# 'ornext|OR' (or next condition) 
		# 'nocase|NC' (no case) 
		# 'last|L' (last rule) 
		# 'QSA' 追加請求字串

		RewriteCond %{DOCUMENT_ROOT}%{REQUEST_FILENAME} !-s 
		RewriteCond %{DOCUMENT_ROOT}%{REQUEST_FILENAME} !-l 
		RewriteCond %{DOCUMENT_ROOT}%{REQUEST_FILENAME} !-f

		RewriteRule ^(.*)\.(jpg|png|bmp)$ http://shanhyweb.example.com/createimage.jsp?path=%{REQUEST_URI} [NC,L]

	</IfModule>

        <Directory "/svcroot/runtime/webstatic/shanhyweb">
                Options FollowSymLinks
                AllowOverride None
                Require all granted
        </Directory>
</VirtualHost>

關於圖片的處理，推薦大家可以去了解下 GraphicsMagick 處理圖片的。

===========================================

利用這種方法，也可以做其他需求，比如網頁的靜態化：index.do 用來生成 index.html ，Apache 判斷如果有HTML存在就直接響應給瀏覽器，如果不存在就轉發到 index.do 處理生成 index.html 

注意：生成圖片的這個處理，對同一個圖片處理那段程式碼要做好加鎖或同步處理，防止出現高併發情況下，讀取和生成圖片因為資源佔用而出問題的情況。

------------------------------------

（完）