2009-05-26
静的ファイルはTomcatに処理させない
TeedaなどJavaEEでウェブアプリを構築する場合、バックエンドのTomcatやGlassfishにApacheから転送すると思います。しかし、CSSなど静的なファイルまでTomcatに処理させるのはムダなので、これらはApacheで処理を終わらせるような設定を行いましょう。
ProxyPass とか使えば簡単じゃんと思いますが、開発時もスムーズに動くようにするには結構工夫が必要です。開発時に運用時の環境を踏まえておき、デザイナ、プログラマ、デプロイヤー(?)のタスクがスムーズに回るようにしましょう。
構成
サーバアドレスのルート直下にアプリケーションが展開され、それらはTeedaで構築しているとします*1。
さらに静的ファイルに関してはまとめて扱う方が便利なので、1つのディレクトリに納めてしまいます。なのでこんな感じです。
webapp
+ /media
| + css
| + js
| + img
+ index.html
+ list.html
+ detail.html
こう構成しておくと、htmlをDreamweaver等で編集するのが楽です。ただし、開発環境ではうまく動かないのでちょっと細工します(後述)。
運用時
先に運用時の設定ですが、Apacheの設定ファイルに次のように記述します。
ProxyPass /media/ !
ProxyPassでajp://localhost:8009/に転送をかけていますが、あらかじめ特定のパスに関しては通さないように記述するだけです。尚、上から適用されるので順番に注意してください。これで通常のドキュメントルート(/var/www/html/media/)の下に静的ファイルを置けばよいことになります。
デプロイ時
デプロイに使用しているシェルスクリプトは自分の場合、次のようなステップです。
1. SVNからチェックアウト
3. Tomcatを停止する
4. 古いWarを削除し、2で作ったWarを配備する
5. /var/www/html/media/を削除し、SVNから〜/webapp/media/ をエクスポートする
6. Tomcatを起動する
本来はTomcatを再起動する必要はないのですが、貧弱なサーバですと再起動時のコストが厳しく、Tomcatが断末魔の叫びをあげることがあり、再起動かけています。
開発時
開発時、Eclipse上からTomcatを起動するかと思いますが、デフォルトのままであるとアプリケーション名がパスに含まれ、静的ファイルへアクセスできません。同時に開発するアプリが1つしかない場合は、アプリケーションのルートパスを/にすることで解決しますが、管理画面とわけて開発している場合などはそうもいきません。かといって、わけて管理するのはもっと嫌です。
そんな場合は、Tomcatに次のようなしてWebアプリの設定をします。Windowsであれば、TOMCAT_HOME\conf\Catalina\localhost\media.xml とします。
<Context path="/media" docBase="D:\projects\zzzz\product\site\src\main\webapp\media" > </Context>
これでTomcatには/mediaというウェブアプリが作成される事になり、上手い具合にパスが通るようになります。
デザイナ視点で
デザイナ*2としてはwebapp以下をサイト管理に定義すれば、通常通りのデザイン作業が可能です。Teedaではタグがデザインを破壊することはありませんのでさらに開発しやすいですね!ただし、ソースコードの管理はプログラマ側にあわせてしっかりやることを忘れないようにしてください!
尚、プログラマ側の環境(Eclipse)に合わせるように/media以下は相対パスではなく絶対パスで記述します。
プログラマ視点で
プログラマ*3としては、そんな事しなくても簡単に設定できると思わないでください。JavaはEclipseで開発を行うように、HTMLはDreamweaverという開発環境で作成しています。そちらに合わせることで、コーディングを一任できるわけです。SVNからアップデートすればいいだけになりますよ!
- 23 http://d.hatena.ne.jp/
- 8 http://reader.livedoor.com/reader/
- 6 http://b.hatena.ne.jp/entrylist
- 5 http://www.google.co.jp/search?hl=ja&client=firefox-a&rls=org.mozilla:ja:official&hs=x1m&q=java 設計&btnG=検索&lr=lang_ja
- 4 http://74.125.153.132/search?q=cache:bT1hu4hts0IJ:d.hatena.ne.jp/shuji_w6e/20081111+NullAppender&cd=4&hl=ja&ct=clnk&gl=jp
- 4 http://b.hatena.ne.jp/entry/http://d.hatena.ne.jp/shuji_w6e/20090526/1243383335
- 4 http://www.google.co.jp/search?hl=ja&lr=lang_ja&client=firefox-a&rls=org.mozilla:ja:official&hs=HpS&q=mac+java+開発環境&revid=1935019547&ei=LJUcSs_lJs-HkQXji6H8DA&sa=X&oi=revisions_inline&resnum=0&ct=broad-revision&cd=2
- 3 http://b.hatena.ne.jp/entrylist?of=60
- 3 http://b.hatena.ne.jp/entrylist?sort=hot&url=http://d.hatena.ne.jp/
- 3 http://b.hatena.ne.jp/entrymobile/13671241



ひとつ質問なのですが、media/cssや、media/jsなどの、mediaよりも下の階層にあるファイルについても、参照できるのでしょうか?
私の環境では、http://localhost:8080/media/hoge.jpgのように、フォルダの直下にある画像ファイルは参照できるのですが、
http://localhost:8080/media/foo/hoge.jpgのように、さらに下の階層のファイルについては、404が返ってきてしまいました
もし何かご存知であれば、教えていただければ幸いです。
何はともあれ、分かりやすい記事ありがとうございました。