2010.12.29 追記
下記の方法では、エスケープされるべき文字列があるとそれ以降の処理が行われないというバグが発生します。JSPに詳しくないのでよくわかっていないのですが、テンプレート作成をjsp:includeを使って行うと、おかしくなるようです。c:importを使うと、バグが発生しなくなります。
この記事を参考にしてくださったmatsukazさんのサイトでやり方が紹介されていますので、そちらを参考にしてください。宜しくお願いします。
JSPでページをテンプレート化 matsukazの日記
以下、元の記事です。
ネタ的にはJSPなので、Slim3ネタではないといえばそうなのですが、自分みたいにGAE for Javaで初めてJSPを触る人もいるだろうから、自分のメモも兼ねて書いていこうと思います。
まずはこれが基本のテンプレートのlayout.jsp。
layout.jspの中で、さらにheader.jspとmenu.jspとfooter.jspをincludeしています。
header.jspに値を渡すために、layout.jspを読み込むファイルからparam.titleを再度代入しています。
param.contentが、各々のページで書かれる本文です。
<%@page contentType="text/html" pageEncoding="UTF-8" isELIgnored="false" session="false"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<%@taglib prefix="f" uri="http://www.slim3.org/functions"%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>${param.title}</title>
</head>
<body>
<div id="container">
<jsp:include page="/header.jsp">
<jsp:param name="title" value="${param.title}"/>
</jsp:include>
<div id="main">
<div id="content">
${param.content}
</div>
<jsp:include page="/menu.jsp" />
</div>
<jsp:include page="/footer.jsp" />
</div>
</body>
</html>
次は、header.jsp。layout.jspで読み込まれてますね。
単純にヘッダーを定義してるだけです。
<%@page pageEncoding="UTF-8" isELIgnored="false"%>
<div id="header">
<h1>${param.title}</h1>
</div>
次はfooter.jsp。これもlayout.jspで読み込まれています。
単純にフッターを定義しているだけです。
<%@page pageEncoding="UTF-8" isELIgnored="false"%>
<div id="footer">
footer
</div>
次はmenu.jsp。これもlayout.jspで読み込まれています。
単純にサイドバー用のメニューを定義しているだけです。
(今回はcss当ててないのでずらーっと出るだけ)
ちなみにslim3のdemoプロジェクトから取ってきただけですw
<%@page pageEncoding="UTF-8" isELIgnored="false"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@taglib prefix="f" uri="http://www.slim3.org/functions"%>
<div id="menu">
<ul>
<li><a href="${f:url('/performance/')}">Performance<br />Slim3 vs JDO</a></li>
<li><a href="${f:url('/gtx/')}">Global<br />Transaction</a></li>
<li><a href="${f:url('/blog/')}">CRUD</a></li>
<li><a href="${f:url('/checkbox/')}">Checkbox</a></li>
<li><a href="${f:url('/multibox/')}">Multibox</a></li>
<li><a href="${f:url('/radio/')}">Radio</a></li>
<li><a href="${f:url('/select/')}">Select</a></li>
<li><a href="${f:url('/multiselect/')}">Multiselect</a></li>
<li><a href="${f:url('/upload/')}">Upload</a></li>
<li><a href="${f:url('/blobstore/')}">Blobstore</a></li>
<li><a href="${f:url('/locale/')}">Locale</a></li>
<li><a href="${f:url('/timezone/')}">TimeZone</a></li>
<li><a href="${f:url('/ajax/')}">HTML with Ajax</a></li>
<li><a href="${f:url('/ktrwjr/index.html')}">Server side test</a></li>
</ul>
</div>
さて、ここからが本番です。
index.jspで、このlayout.jps群を使って簡単にページを作ろうと思います。
<%@page pageEncoding="UTF-8" isELIgnored="false" session="false"%>
<jsp:include page="/layout.jsp">
<jsp:param name="title" value="Index"/>
<jsp:param name="content">
<jsp:attribute name="value">
<p>Hello Index !!!</p>
</jsp:attribute>
</jsp:param>
</jsp:include>
param.contentの値が、jsp:attribute name=”value”内の文字列になるので、layout.jspの${param.content}にHello Index!!!が入ります。タイトルはページ毎に変えたいので、各ページ側からjsp:param name=”title” value=”タイトル”で変えていきます。
ここまで分かれば、あとはlayout.jsp側や、そこから読み込んでいるheader, footer, menuを修正するのみ。コンテンツ制作者というかプログラマーはparam.contentに入れる値だけに注力すればいいはず!!
これでようやくやりたいことのスタート地点に立てたかなーという感じですね…。
今まで散々CakePHPとかのお世話になっているから、jspのやり方は全く分からなくて大変ですが、GAE使えるようになりたいんで頑張ってSlim3の流儀も覚えていきたいと思います。