8月 122011
 

small lightシリーズ
[1] ライブドアのsmalllightを使って動的に画像をリサイズしてみる
[2] いろいろsmalllightを使って動的に画像をリサイズしてみる
[3] smalllightでのエンジンの選択の仕方
[4] smalllightでのエンジンの選択の仕方 (ヒントオプション追加)

先ほど書いた「ライブドアのsmalllightを使って動的に画像をリサイズしてみる」では
とりあえず入れてみて、リサイズしてみた!といった感じでしたが
僕が触ってみてこうしたら楽だとかの設定例を上げてみます。

ケース1 拡張子混在で使う

例えばjpg,gif,pngと混在していた場合、わざわざ設定で以下のように書くのは馬鹿らしいです。


RewriteRule ^/thumb_1/(.*\.jpg)$ /small_light(dw=70,dh=70,cw=70,ch=70,e=imlib2,info=1,of=jpeg,q=50)/$1 [P,L]
RewriteRule ^/thumb_1/(.*\.gif)$ /small_light(dw=70,dh=70,cw=70,ch=70,e=imagemagick,info=1,of=gif)/$1 [P,L]
RewriteRule ^/thumb_1/(.*\.png)$ /small_light(dw=70,dh=70,cw=70,ch=70,e=imlib2,info=1,of=png)/$1 [P,L]
RewriteRule ^/thumb_2/(.*\.jpg)$ /small_light(dw=80,dh=80,cw=80,ch=80,e=imlib2,info=1,of=jpeg,q=50)/$1 [P,L]
RewriteRule ^/thumb_2/(.*\.gif)$ /small_light(dw=80,dh=80,cw=80,ch=80,e=imagemagick,info=1,of=gif)/$1 [P,L]
RewriteRule ^/thumb_2/(.*\.png)$ /small_light(dw=80,dh=80,cw=80,ch=80,e=imlib2,info=1,of=png)/$1 [P,L]

そこで事前に以下のようにSetEnvIfでパラメータを作ってあげてSmallLightPatternDefineを利用するとすっきりします。


SetEnvIf Request_URI "\.jpe?g$"   sml_para=of=jpeg,e=imlib2,info=1
SetEnvIf Request_URI "\.gif$"     sml_para=of=gif,e=imagemagick,info=1
SetEnvIf Request_URI "\.png$"     sml_para=of=png,e=imlib2,info=1

SmallLightPatternDefine THUMB1 dw=70,dh=70,cw=70,ch=70,q=50
SmallLightPatternDefine THUMB2 dw=80,dh=80,cw=80,ch=80,q=50

RewriteRule ^/thumb_1/(.*)$ /small_light(p=THUMB1,%{ENV:sml_para})/$1 [P,L]
RewriteRule ^/thumb_2/(.*)$ /small_light(p=THUMB2,%{ENV:sml_para})/$1 [P,L]

設定が増えてもすごい楽になると思います。
もしサムネの命名ルールが
/thumb_\d/
ならこういうふうに楽することもできます。


SetEnvIf Request_URI "\.jpe?g$"   sml_para=of=jpeg,e=imlib2,info=1
SetEnvIf Request_URI "\.gif$"     sml_para=of=gif,e=imagemagick,info=1
SetEnvIf Request_URI "\.png$"     sml_para=of=png,e=imlib2,info=1

SmallLightPatternDefine THUMB1 dw=70,dh=70,cw=70,ch=70,q=50
SmallLightPatternDefine THUMB2 dw=80,dh=80,cw=80,ch=80,q=50
.....

RewriteRule ^/thumb_([0-9]*)/(.*)$ /small_light(p=THUMB$1,%{ENV:sml_para})/$2 [P,L]

楽ですね!


ケース2 マルチドメインで使う

以下の図のようにimg1~img3まで有る場合どのように設定すれば楽でしょうか?

一例を説明します
設定をsmall_light共通のところとvirtual設定に分けてあげます。

/etc/httpd/conf.d/mod_small_light.conf


SetEnvIf Request_URI "\.jpe?g$"   sml_para=of=jpeg,e=imlib2,info=1
SetEnvIf Request_URI "\.gif$"     sml_para=of=gif,e=imagemagick,info=1
SetEnvIf Request_URI "\.png$"     sml_para=of=png,e=imlib2,info=1

NameVirtualHost *:80

/etc/httpd/conf.d/virtual_img1.example.net.conf


<VirtualHost *:80>
  ServerName        img1.example.net
  ProxyPreserveHost On
  RewriteEngine     On

  <LocationMatch ^/small_light[^/]*/>
    SetOutputFilter SMALL_LIGHT
  </LocationMatch>

  SmallLightPatternDefine THUMB1 dw=70,dh=70,cw=70,ch=70,q=50,ds=s
  SmallLightPatternDefine THUMB2 dw=100,dh=100,cw=100,ch=100,q=50,ds=s
  SmallLightPatternDefine THUMB3 dw=200,dh=200,cw=200,ch=200,q=50,ds=s

  RewriteRule ^/thumb_([0-9]+)/(.*)$ / http://127.0.0.1/small_light(p=THUMB$1,%{ENV:sml_para})/$2 [P,L]

  RewriteRule ^/small_light[^/]*/(.+)$ http://192.168.1.199/$1 [P,L]
  RewriteRule /(.+)                    http://192.168.1.199/$1 [P,L]
</VirtualHost>

/etc/httpd/conf.d/virtual_img2.example.net.conf


<VirtualHost *:80>
  ServerName        img2.example.net
  ProxyPreserveHost On
  RewriteEngine     On
  ~略~
</VirtualHost>

/etc/httpd/conf.d/virtual_img2.example.net.conf


<VirtualHost *:80>
  ServerName        img3.example.net
  ProxyPreserveHost On
  RewriteEngine     On
  ~略~
</VirtualHost>

上記の設定を行い各URLにアクセスするとちゃんとマルチドメインで動くのを確認できます。

マルチドメインの時のポイントとして二点あります

ProxyPreserveHostの設定

バックエンドのサーバがvirtualを使っている場合Hostの引継が必要なので


ProxyPreserveHost On

ProxyPreserveHost
Proxyした際にHostを引き継ぐために必要です

リライトの設定

リライトの時に/からではなくhttp://127.0.0.1を指定します


  RewriteRule ^/thumb_([0-9]+)/(.*)$ / http://127.0.0.1/small_light(p=THUMB$1,%{ENV:sml_para})/$2 [P,L]

ProxyPreserveHostをOnにした状態で/から始めるとたぶんHostのドメインに取りに行きますので


ケース3 サムネを作る際に特定のサイズに収まるようにしたい

サイズを縮小したい時に90×90みたいに固定サイズではなく
長辺(横幅か縦幅で長い方の辺のこと)が480以上の時は縮小したい、拡大はしたくないといったケースがあると思います。
その場合は以下のように設定します


dw=480,dh=480,da=l

長辺が480ということは480×480の正方形に収まるサイズということなので上記のように設定します。
以下のように縦長でも横長でも比率を維持して縮小できます。


ケース4 固定サイズのサムネを作る際に、元サイズの比率が違う場合でも内容を維持したい、または背景色が出ないようにしたい

言いたかったのは例えば90×90のサムネイルに対して入力画像が640×480だったとします。
その際に比率を維持してサムネイル納める場合は
横幅を90まで小さくして縦幅を67まで小さくして隙間を背景色で埋める方法と
縦幅を90まで小さくして横幅で90を超えた部分に関しては削除する方法があります
それぞれ設定は以下のとおりです

画像の比率を維持しつつ削除しない


dw=90,dh=90,cw=90,ch=90,da=l,cc=ff0000

画像の比率を維持しつつサイズが超えたところは削除


dw=90,dh=90,cw=90,ch=90,da=s,cc=ff0000


長辺を基準(da=l)にした場合は削除はされない
短辺を基準(da=s)にした場合は削除はされると覚えましょう

次に続きます
->[記事書いた]smalllightでのエンジンの選択の仕方


 Leave a Reply

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

(required)

(required)