Powered by SmartDoc
<< J2EE II (2004年度)/JSPの作成

JSPの作成

JSFでのJSPの記述

JSFでは、タグライブラリを利用してJSPページを作成します。基本的には、タグライブラリ中のカスタムタグがUIコンポーネントに対応することになります。

それでは、JSPの記述方法について見てみましょう。

JSPの例

まず、単純な構造を持つJSPのサンプルです。

test.jsp
<%@ page contentType="text/html; charset=Shift_JIS" %>
<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %>

<html>
<head>
<link href="style.css" type="text/css" rel="stylesheet" />
<title>JSF: 簡単なJSPのテスト</title>
</head>
<body>

<h1>JSF: 簡単なJSPのテスト</h1>

<f:view>
    <h:form id="searchForm">
        <p>何か入力してね !</p>
        <h:inputText id="word" />
    </h:form>
</f:view>

</body>
</html>

このJSPをWebブラウザで表示すると、図7.1[JSPの画面表示]のようになります。

JSPの画面表示

タグライブラリの利用の宣言

まず、タグライブラリの利用を宣言します。

次の部分は、JSFのHTML tagの利用を宣言しています。このタグライブラリは、HTMLの出力に関係するタグを集めたものです。

<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %>

次に、Core tagの宣言です。Core tagは、HTML出力とは関係しないタグを集めたものです。

<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %>

f:view タグ

JSPにはf:viewというタグが出てきます。

JSFのタグは、すべてf:viewタグの中に記述します。f:viewタグは、言わばJSFのタグの「コンテナ」としての働きをするのです。

<f:view>
    <h:form>
        ……
    </h:form>
</f:view>

h:form タグ

f:view要素の中に、h:form要素が出てきます。これは、フォームを表すUIコンポーネントです。HTMLではformタグとなります。

<f:view>
    <h:form>
        ……
    </h:form>
</f:view>

h:input タグ

h:inputタグは、テキスト入力用のUIコンポーネントです。HTMLでは<input type="text">となります。

<h:form>
    <h:inputText id="word" />
</h:form>

id 属性

UIコンポーネントには、id属性を付けることができます。idはf:view要素の中でそれぞれ違っている必要があります。また、idは省略することもできます。その場合はJSFにより自動的にidが付けられます。

<h:form id="searchForm">
    <p>何か入力してね !</p>
    <h:inputText id="word" />
</h:form>

生成されたHTMLのソース

このJSPをWebブラウザ上に表示させると、次のようなHTMLが生成されることがわかります。

<form id="searchForm" method="post"
      action="/jsf-test01/jsp/test.jsp;
             jsessionid=0DF696E1084D276D5841AF0EE3DA9D66"
      enctype="application/x-www-form-urlencoded">
    <p>何か入力してね !</p>
    <input id="searchForm:word" type="text" 
        name="searchForm:word" />
    <input type="hidden" name="searchForm" 
        value="searchForm" />
</form>

JSPを動かす

Tomcatへの配置

前節で示したJSPをTomcat上で動かすには、%CATALINA_HOME%\webappsディレクトリの下に、次のような構成でファイルを配置します。ここでは、Webアプリケーションの名前をjsf-test01としています。

jsf-test01 --- test.jsp
               |- WEB-INF/ ---- web.xml
                            |-- faces-config.xml
                            |-- lib/
                                 |- commons-beanutils.jar
                                 |- commons-collections.jar
                                 |- commons-digester.jar
                                 |- commons-logging.jar
                                 |- jsf-api.jar
                                 |- jsf-impl.jar
                                 |- jstl.jar
                                 |- standard.jar

必要なライブラリ

まずJSFのlibフォルダ中にあるjarファイルを、WEB-INF\libにコピーします。

そして、JSTLのlibフォルダ中にあるjarファイルもコピーします。

faces-config.xmlの作成

次に、faces-config.xmlを作成します。

<?xml version="1.0"?>

<!DOCTYPE faces-config PUBLIC
  "-//Sun Microsystems, Inc.//DTD JavaServer Faces Config 1.1//EN"
  "http://java.sun.com/dtd/web-facesconfig_1_1.dtd">

<faces-config>

</faces-config>

faces-config要素を用意します。今回はまだ空のままです。

web.xmlの作成

次に、web.xmlです。

<?xml version='1.0' encoding='UTF-8'?>

<!DOCTYPE web-app PUBLIC
  "-//Sun Microsystems, Inc.//DTD Web Application 2.3//EN"
  "http://java.sun.com/dtd/web-app_2_3.dtd">

<web-app>

    <display-name>
        JSF: jsp sample
    </display-name>
    <description>
        JSF: jsp sample
    </description>

    <servlet>
        <servlet-name>Faces Servlet</servlet-name>
        <servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
        <load-on-startup> 1 </load-on-startup>
    </servlet>

    <servlet-mapping>
        <servlet-name>Faces Servlet</servlet-name>
        <url-pattern>/jsp/*</url-pattern>
    </servlet-mapping>

</web-app>

servlet要素では、Controllerで使うServletとしてjavax.faces.webapp.FacesServletを指定します。また、load-on-startup要素は、この(JSFを使った) Webアプリケーションの起動時に、１つのServletが動作することを示します。

JSFでは、Webブラウザからの要求は、すべてFacesServletが処理をします。JSPの表示も例外ではありません。

<url-pattern>/jsp/*</url-pattern>

JSPを表示するときは、この/jspを含めた名前でアクセスする必要があります。

JSPを呼び出すURL

ファイルの配置が終わったら、Tomcatを起動します。

このとき、次のURLにアクセスします。

(正しいURL)
http://localhost:8080/jsf-test01/jsp/test.jsp

jsf-test01の直下にあるからといって、

(間違ったURL)
http://localhost:8080/jsf-test01/test.jsp

にアクセスしてもエラーになります。なぜなら、JSPの表示もすべてFacesServletを経由する必要があるからです。

<< J2EE II (2004年度)/JSPの作成