MySQL データベースを使用した単純な Web アプリケーションの作成
執筆: Troy Giunipero
ここでは、MySQL データベースサーバーに接続する簡単な Web アプリケーションを作成する方法を説明します。また、JavaServer Pages (JSP)、JavaServer Pages 標準タグライブラリ (JSTL)、Java Database Connectivity (JDBC) API、および 2 層のクライアントサーバーアーキテクチャーなどの、Web 開発での基本的なアイデアやテクノロジも紹介します。このチュートリアルは、Web 開発の基礎的な知識があり、MySQL データベースを使用して知識を応用しようとしている初心者を対象としています。
MySQL は、その速さ、柔軟性、および信頼性により、Web アプリケーションで一般的に利用されている人気のオープンソースデータベース管理システムです。MySQL は、データベース内のデータへのアクセスおよび処理に SQL (Structured Query Language) を使用しています。
このチュートリアルは、「MySQL Database への接続」チュートリアルの続きです。MyNewDatabase という名前の MySQL データベースを作成済みで、NetBeans IDE で接続が登録されていることを前提としています。そのチュートリアルで使用した表データは ifpwafcad.sql に格納されており、このチュートリアルでも必要です。この SQL ファイルによって Subject および Counselor の 2 つの表が作成され、これらにサンプルデータが追加されます。必要に応じて、このファイルをコンピュータに保存し、NetBeans IDE で開いて、MyNewDatabase という名前の MySQL データベース上で実行します。
目次
このチュートリアルに従うには、次のソフトウェアとリソースが必要です。
注:
- NetBeans IDE の Java ダウンロードバンドルを使用して、GlassFish サーバーをインストールできます。このチュートリアルを行うには、GlassFish サーバーが必要になります。
- MySQL Connector/J JDBC ドライバは、Java プラットフォームと MySQL データベースプロトコルとの間の通信に必要なもので、NetBeans IDE に組み込まれています。
- プロジェクトを、正常に機能するソリューションと比較する必要がある場合は、サンプルアプリケーションをダウンロードできます。
構造の計画
単純な Web アプリケーションは、クライアントがサーバーと直接通信する 2 層アーキテクチャーを使用して設計できます。このチュートリアルの Java Web アプリケーションは、Java Database Connectivity API を使用して MySQL データベースと直接通信します。基本的に、アプリケーションサーバー (GlassFish サーバー) が認識する Java コードと、SQL 内の任意の内容、つまりデータベースサーバー (MySQL) が認識する言語との間で通信を可能にするのは、MySQL Connector/J JDBC ドライバです。
このチュートリアルで構築するアプリケーションには、2 つの JSP ページの作成が含まれます。各ページで、HTML と CSS を使用して単純なインタフェースを実装します。また、データベースに対して直接クエリーを実行し、取得したデータを 2 つのページに挿入するロジックを実行するために、JSTL テクノロジを使用します。この 2 つのデータベース表は Subject と Counselor で、「MySQL データベースへの接続」チュートリアルで作成する MySQL データベース MyNewDatabase に含まれています。次の 2 層方式のシナリオについて考えてみます。
開始ページ (index.jsp) では、簡単な HTML フォームがユーザーに表示されます。ブラウザが index.jsp を要求すると、ページ内の JSTL コードが MyNewDatabase に対してクエリーを開始します。Subject データベース表からデータを取得し、そのデータをページに挿入してからブラウザに送信します。ユーザーが開始ページの HTML フォームから選択内容を送信すると、その応答ページ (response.jsp) に対する要求が開始されます。ページ内の JSTL コードは、MyNewDatabase に対するクエリーをもう一度開始します。今度は、Subject 表と Counselor 表の両方からデータが取得されて、ページに挿入されます。これにより、ページがブラウザに返されたときに、ユーザーは自分の選択内容に基づいたデータを見ることができます。
前述のシナリオを実装するため、IFPWAFCAD (The International Former Professional Wrestlers' Association for Counseling and Development) という架空の企業向けに単純なアプリケーションを開発します。
index.jsp
response.jsp
新規プロジェクトの作成
最初に、IDE で新しい Java Web プロジェクトを作成します。
- メインメニューから「ファイル」>「新規プロジェクト」(Ctrl-Shift-N、Mac の場合は ⌘-Shift-N) を選択します。「Java Web」カテゴリを選択し、「Web アプリケーション」を選択します。「次へ」をクリックします。
「新規プロジェクト」ウィザードを使用すると、標準的な IDE プロジェクト内に空の Web アプリケーションを作成できます。標準的なプロジェクトでは、IDE が生成した Ant 構築スクリプトを使用して、アプリケーションをコンパイル、配備、および実行します。
- 「プロジェクト名」に「IFPWAFCAD」と入力します。また、コンピュータ上でのプロジェクトの場所を指定します。デフォルトでは、IDE はホームディレクトリの
NetBeansProjects フォルダにプロジェクトを配置します。「次へ」をクリックします。
- 「サーバーと設定」パネルで、アプリケーションの実行に使用するサーバーとして GlassFish サーバーを指定します。
注. GlassFish サーバーは、Java バージョンの NetBeans IDE をインストールしている場合に、「サーバー」ドロップダウンフィールドに表示されます。GlassFish サーバーはダウンロードに含まれているため、自動的に IDE に登録されます。このプロジェクトでほかのサーバーを使用する場合は、「サーバー」ドロップダウンフィールドの横にある「追加」ボタンをクリックし、ほかのサーバーを IDE に登録します。ただし、GlassFish サーバー以外のサーバーの操作については、このチュートリアルでは説明しません。
- 「Java EE バージョン」フィールドで「Java EE 5」を選択します。
Java EE 6 Web プロジェクトでは web.xml 配備記述子を使用する必要はなく、NetBeans プロジェクトテンプレートには、Java EE 6 プロジェクトの web.xml ファイルは含まれていません。ただし、このチュートリアルでは、配備記述子でデータソースを宣言する方法について説明します。これにより、Java EE 6 固有の機能に依存する必要がなくなるため、プロジェクトのバージョンを Java EE 5 に設定できます。
注. プロジェクトのバージョンを Java EE 6 に設定したままで、web.xml 配備記述子を作成することもできます。これを行うには、「新規ファイル」ウィザードから「Web」カテゴリを選択し、「標準の配備記述子」を選択します。
- 「完了」をクリックします。IDE でアプリケーション全体のプロジェクトテンプレートが作成され、空の JSP ページ (
index.jsp) がエディタに表示されます。index.jsp ファイルはアプリケーションの開始ページとして動作します。新規プロジェクトは、Sun Java BluePrints のガイドラインに従って構造化されます。
Web インタフェースの準備
最初に、開始ページ (index.jsp) と応答ページ (response.jsp) を準備します。開始ページには、ユーザーのデータを取り込むために使用する HTML フォームを実装します。また、どちらのページにも、構造化された形でデータを表示する HTML 表を実装します。この節では、両方のページの外観を整えるためのスタイルシートも作成します。
アプリケーションとデータベース間の通信の準備
サーバーとデータベースとの間の通信を実装するためのもっとも効率的な方法は、データベース接続プールを設定することです。クライアント要求ごとに新しい接続を作成すると、特にアプリケーションが多量の要求を継続的に受け取るものである場合、かなり時間がかかる場合があります。これを解決するため、接続プール内に多数の接続が作成されて管理されます。アプリケーションのデータレイヤーへのアクセスを要求する受信要求があると、作成済みの接続がプールから使用されます。同様に、要求が完了すると、その接続は閉じられずに、プールに返されます。
サーバー用のデータソースと接続プールの準備ができたら、そのデータソースを使用するようアプリケーションに指示する必要があります。これは通常、アプリケーションの web.xml 配備記述子内にエントリを作成することで実行します。最後に、データベースドライバ (MySQL Connector/J JDBC ドライバ) がサーバーにアクセスできることを確認する必要があります。
重要: これ以降では、MyNewDatabase という名前の MySQL データベースが設定され、このデータベースに ifpwafcad.sql で提供されるサンプルデータが格納されている必要があります。この SQL ファイルによって Subject および Counselor の 2 つの表が作成され、これらにサンプルデータが生成されます。これをまだ実行していない場合、またはこの作業に関する支援が必要な場合、作業を進める前に「MySQL データベースへの接続」を参照してください。
また、このチュートリアルでデータソースを作成して GlassFish サーバーで操作するために、データベースをパスワードで保護しておく必要があります。パスワードが設定されていないデフォルトの MySQL root アカウントを使用している場合は、コマンド行プロンプトからパスワードを設定できます。
このチュートリアルでは、パスワードの例として nbuser を使用します。パスワードを nbuser に設定するには、コマンド行プロンプトで MySQL のインストールディレクトリの bin ディレクトリに移動し、次のように入力します。
shell> mysql -u root
mysql> UPDATE mysql.user SET Password = PASSWORD('nbuser')
-> WHERE User = 'root';
mysql> FLUSH PRIVILEGES;
詳細は、MySQL 公式リファレンスマニュアルの「初期 MySQL アカウントの保護」を参照してください。
- JDBC データソースと接続プールの設定
- アプリケーションからのデータソースの参照
- サーバーにデータベースドライバの JAR ファイルを追加
JDBC データソースと接続プールの設定
GlassFish Server Open Source Edition には、開発者に意識させることなく接続プール機能を提供する、DBCP (データベース接続プール) ライブラリがあります。このライブラリを利用するには、アプリケーションが接続プール用に使用できるサーバーの Java Database Connectivity (JDBC) データソースを設定する必要があります。
JDBC テクノロジの詳細については、「Java チュートリアル: JDBC の基本」を参照してください。
データソースを GlassFish サーバーの管理コンソール内で直接設定するか、次に説明するように、アプリケーションが必要とするリソースを sun-resources.xml ファイル内で宣言することができます。アプリケーションが配備されると、サーバーがリソース宣言を読み込み、必要なリソースを作成します。
次の手順は、接続プールと、その接続プールに依存するデータソースを宣言する方法です。NetBeans の「新規 JDBC リソース」ウィザードを使用すると、両方の操作を実行できます。
- IDE のメインツールバーで「新規ファイル」(
) ボタンを押して、「新規ファイル」ウィザードを開きます。「GlassFish」サーバーカテゴリを選択し、「JDBC リソース」を選択して「次へ」をクリックします。
- ステップ 2 の「一般属性」で、「新規の JDBC 接続プールを作成」オプションを選択し、「JNDI 名」テキストフィールドに「jdbc/IFPWAFCAD」と入力します。
JDBC データソースは、JNDI (Java Naming and Directory Interface) に依存します。JNDI API は、アプリケーションでデータソースを検索、利用するための共通の手段を提供します。詳細については、「JNDI チュートリアル」を参照してください。
- (任意) データソースには説明を追加できます。たとえば、「
IFPWAFCAD アプリケーション用のデータを提供するデータベースにアクセスします」と入力します。
- 「次へ」をクリックし、もう一度「次へ」をクリックして「ステップ 3 プロパティー」をスキップします。
- ステップ 4 で「JDBC 接続プール名」に「IfpwafcadPool」と入力します。「既存の接続から抽出」オプションが選択されていることを確認し、ドロップダウンリストから「
jdbc:mysql://localhost:3306/MyNewDatabase」を選択します。
注: IDE で設定されたデータベース接続がある場合、ウィザードで検出されます。そのため、この時点で MyNewDatabase データベースへの接続がすでに作成されている必要はありません。作成されている接続を確認するには、「サービス」ウィンドウを開き (Ctrl-5、Mac の場合は ⌘-5)、「データベース」カテゴリで接続ノード (
) を検索します。
- 「次へ」をクリックします。ステップ 5 では、IDE が、前のステップで指定したデータベース接続から情報を抽出し、新規接続プール用の名前と値のプロパティーを設定します。
- 「完了」をクリックします。ウィザードによって
glassfish-resources.xml·ファイルが生成され、指定したデータソースと接続プール用のエントリが格納されます。
「プロジェクト」ウィンドウで、新しく作成した「サーバーリソース」>「glassfish-resources.xml」ファイルを開くことができ、このファイルの <resources> タグ内には、前の手順で指定した値を持つデータソースと接続プールが宣言されています。
注. NetBeans IDE 6.9 およびそれ以前のバージョンの IDE では、IDE によって生成されるファイルの名前は sun-resources.xml です。
新しいデータソースと接続プールが実際に GlassFish サーバーに登録されていることを確認するには、プロジェクトをサーバーに配備して、IDE の「サービス」ウィンドウ内でリソースを検索します。
- 「プロジェクト」ウィンドウで「IFPWAFCAD」プロジェクトノードを右クリックし、「配備」を選択します。まだ実行されていない場合はサーバーが起動し、プロジェクトがコンパイルされ、そのサーバーに配備されます。
- 「サービス」ウィンドウを開き (Ctrl-5、Mac の場合は ⌘-5)、「サーバー」>「GlassFish」>「リソース」>「JDBC」>「JDBC リソース」ノードおよび「接続プール」ノードを展開します。新しいデータソースと接続プールが表示されます。
アプリケーションからのデータソースの参照
構成した JDBC リソースを Web アプリケーションから参照する必要があります。これを行うには、アプリケーションの web.xml 配備記述子にエントリを作成します。
配備記述子は XML ベースのテキストファイルで、アプリケーションを特定の環境に配備する方法を記述した情報が含まれています。通常これらは、アプリケーションコンテキストパラメータと動作パターンの指定、セキュリティー設定、およびサーブレット、フィルタ、リスナーのマッピングに使用されます。
注. プロジェクトの作成時に Java バージョンとして Java EE 6 を指定した場合は、「新規ファイル」ウィザードで「Web」>「標準の配備記述子」を選択して、配備記述子ファイルを作成する必要があります。
データソースをアプリケーションの配備記述子の中で参照するには、次の手順を実行します。
- 「プロジェクト」ウィンドウで「構成ファイル」フォルダを展開し、
web.xml をダブルクリックします。ファイルのグラフィカルインタフェースが IDE のメインウィンドウに表示されます。
- エディタの最上部にある「参照」タブをクリックします。
- 「リソース参照」見出しを展開し、「追加」をクリックして「リソース参照を追加」ダイアログを開きます。
- 「リソース名」に、前出でサーバーのデータソースの構成時に付けたリソース名 (
jdbc/IFPWAFCAD) を入力します。「説明」フィールドの入力は省略できますが、リソースに分かりやすい説明を入力できます (「IFPWAFCAD アプリケーションのデータソース」など)。「了解」をクリックします。
「了解」をクリックします。「リソース参照」見出しの下に新しいリソースが表示されています。
-
リソースが
web.xml ファイルに追加されたことを確認するには、エディタの最上部にある「XML」タブをクリックします。次に示す <resource-ref> タグが含まれるようになりました。
<resource-ref>
<description>Database for IFPWAFCAD application</description>
<res-ref-name>jdbc/IFPWAFCAD</res-ref-name>
<res-type>javax.sql.DataSource</res-type>
<res-auth>Container</res-auth>
<res-sharing-scope>Shareable</res-sharing-scope>
</resource-ref>
サーバーにデータベースドライバの JAR ファイルを追加
データベースドライバの JAR ファイルの追加は、サーバーとデータベースが通信できるようにするために不可欠な、もう 1 つの手順です。通常、データベースドライバのインストールディレクトリを特定し、ドライバのルートディレクトリにある mysql-connector-java-5.1.6-bin.jar ファイルを、使用しているサーバーのライブラリにコピーします。IDE のサーバー管理では、JAR ファイルが追加されているかどうかを配備時に検出できます。追加されていない場合、これが自動的に行われます。
この処理を確認するため、「サーバー」ウィンドウ (「ツール」>「サーバー」を選択) を開きます。IDE には、「JDBC ドライバの配備を有効化」オプションが用意されています。このオプションが有効化されている場合、サーバーの配備対象アプリケーションに必要なドライバがあるかどうかを判断するための確認が開始されます。MySQL で、ドライバが必要だが見つからない場合、IDE にバンドルされているドライバがサーバー上の適切な場所に配備されます。
- 「ツール」>「サーバー」を選択して、「サーバー」ウィンドウを開きます。左区画で GlassFish サーバーを選択します。
- 主区画で、「JDBC ドライバの配備を有効化」オプションを選択します。
- ウィンドウを閉じる前に、「ドメインフォルダ」テキストフィールドに示されているパスを書き留めます。IDE で GlassFish サーバーに接続すると、実際はアプリケーションサーバーのインスタンスに接続されます。各インスタンスは一意のドメインでアプリケーションを実行し、「ドメイン名」フィールドはサーバーが使用しているドメインの名前を示します。上の図に示されているように、ドライバの JAR ファイルは
domain1 内に存在します。これは、GlassFish サーバーをインストールしたときに作成されたデフォルトのドメインです。
- 「閉じる」をクリックして「サーバー」ウィンドウを終了します。
- コンピュータ上で、GlassFish サーバーのインストールディレクトリに移動し、「
domains」>「domain1」>「lib」サブフォルダに移動します。IFPWAFCAD プロジェクトはすでにサーバーに配備されているため、「mysql-connector-java-5.1.6-bin.jar」ファイルが存在しているはずです。ドライバの JAR ファイルがない場合は、次の手順を実行します。
- プロジェクトをサーバーに配備します。IIDE の「プロジェクト」ウィンドウで、プロジェクトノードの右クリックメニューから「配備」を選択します。進捗状況は、IDE の出力ウィンドウ (Ctrl-4、Mac の場合は ⌘-4) に表示されます。この出力に、GlassFish サーバーの場所に MySQL ドライバが配備されることが示されます。
ここでコンピュータ上の domain1/lib サブフォルダに戻ると、mysql-connector-java-5.1.6-bin.jar ファイルが自動的に追加されています。
動的ロジックの追加
ここでは、以前にこのチュートリアルで作成した index.jsp プレースホルダと response.jsp プレースホルダに戻り、ページがユーザーの入力内容などに応じて動的にコンテンツを生成できる JSTL コードを実装します。これを行うには、次の 3 つのタスクを実行します。
- プロジェクトのクラスパスに JSTL ライブラリを追加
- JSTL コードの実装
プロジェクトのクラスパスに JSTL ライブラリを追加
JavaServer Pages 標準タグライブラリ (JSTL) を適用して、データベースから取得したデータにアクセスしたり、そのデータを表示したりできます。GlassFish サーバーには、デフォルトで JSTL ライブラリが含まれています。これを確認するには、「プロジェクト」ウィンドウで「IFPWAFCAD」を展開して「ライブラリ」>「GlassFish Server 3」ノードを選択し、jstl-impl.jar ファイルを探します。GlassFish サーバーのライブラリにはプロジェクトのクラスパスがデフォルトで追加されているため、このタスクのためにこれ以上手順を実行する必要はありません。
JSTL には、4 つの基本的な機能領域が用意されています。これらを次に示します。
コア: 反復子や条件などの、フロー制御を処理するための共通の構造的タスクfmt: 国際化およびローカライズのメッセージ整形sql: 簡単なデータベースアクセスxml: XML コンテンツの処理
このチュートリアルでは、コア および sql タグライブラリの使用法を中心に説明します。
JSTL の詳細については、「Java EE 5 チュートリアル: 第 7 章 - JavaServer Pages 標準タグライブラリ」を参照してください。
JSTL コードの実装
ここでは、各ページでデータを動的に取得して表示するコードを実装します。どちらのページにも、このチュートリアルで以前に作成したデータソースを利用する SQL クエリーを実装する必要があります。
IDE にはデータベースに固有の JSTL スニペットがいくつか用意されており、パレット (Ctrl-Shift-8、Mac の場合は ⌘-Shift-8) から選択できます。
エディタで Ctrl- スペースキーを押して、パレットの項目にアクセスすることもできます。データベースの項目をフィルタリングするには、「db」と入力して、Ctrl- スペースキーを押します。
index.jsp
index.jsp 内のフォームの内容を動的に表示するには、Subject データベース表のすべての name にアクセスする必要があります。
- マウスをパレットの「DB レポート」項目の上に移動します。
「DB レポート」項目は、<sql:query> タグを使用して SQL クエリーを作成してから、<c:forEach> タグを使用してクエリーの resultset をループし、取得したデータを出力します。
<%@page ... %> 宣言 (行 7) のすぐ上の行にカーソルを置き、パレットの「DB レポート」項目をダブルクリックします。表示されたダイアログに、次の詳細を入力します。
- 変数名:
subjects
- スコープ:
page
- データソース:
jdbc/IFPWAFCAD
- クエリー文:
SELECT subject_id, name FROM Subject
- 「了解」をクリックします。次の内容が
index.jsp ファイル内に生成されます。新しい内容はボールドで表示しています。
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@taglib prefix="sql" uri="http://java.sun.com/jsp/jstl/sql"%>
<%--
Document : index
Created on : Dec 22, 2009, 7:39:49 PM
Author : nbuser
--%>
<sql:query var="subjects" dataSource="jdbc/IFPWAFCAD">
SELECT subject_id, name FROM Subject
</sql:query>
<table border="1">
<!-- column headers -->
<tr>
<c:forEach var="columnName" items="${subjects.columnNames}">
<th><c:out value="${columnName}"/></th>
</c:forEach>
</tr>
<!-- column data -->
<c:forEach var="row" items="${subjects.rowsByIndex}">
<tr>
<c:forEach var="column" items="${row}">
<td><c:out value="${column}"/></td>
</c:forEach>
</tr>
</c:forEach>
</table>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
生成されたコンテンツで使用される JSTL タグのために必要な taglib 指令 (<sql:query> および <c:forEach>) が、IDE によって自動的に追加されました。taglib 指令は、JSP ページがカスタム (つまり、JSTL) タグを使用することを宣言し、タグを定義するタグライブラリおよびタグの接頭辞を指定します。
- プロジェクトを実行し、ブラウザでどのように表示されるかを確認します。「プロジェクト」ウィンドウでプロジェクトノードを右クリックし、「実行」を選択します。
「実行」を選択すると、IDE によってプロジェクトが GlassFish サーバーに配備され、インデックスページがサーブレットにコンパイルされ、開始ページがデフォルトのブラウザに表示されます。「DB レポート」項目から生成されたコードによって、開始ページ内に次の表が作成されます。
このように、「DB レポート」項目を使用すると、データベース接続をすばやくテストし、データベースの表データをブラウザで表示できるようになります。これは、プロトタイプを作成する場合に非常に便利です。
次の手順では、生成されたコードを、このチュートリアルで以前に作成した HTML ドロップダウンリストに統合する方法について説明します。
- 生成されたコードの列データを確認します。2 つの
<c:forEach> タグが使用されており、1 つがもう 1 つの入れ子になっています。これにより、JSP コンテナ (つまり、GlassFish サーバー) が表のすべての行でループを実行し、行ごとにすべての列をループします。この方法で、表全体のデータが表示されます。
- 次のように、
<c:forEach> タグを HTML フォームに統合します。データベースに記録されているように、各項目の値は subject_id に、出力テキストは name になります。変更場所はボールドで示されています。
<form action="response.jsp">
<strong>Select a subject:</strong>
<select name="subject_id">
<c:forEach var="row" items="${subjects.rowsByIndex}">
<c:forEach var="column" items="${row}">
<option value="<c:out value="${column}"/>"><c:out value="${column}"/></option>
</c:forEach>
</c:forEach>
</select>
<input type="submit" value="submit" name="submit" />
</form>
別の簡単な方法として、次のように <c:forEach> タグを HTML フォームに統合することもできます。
<form action="response.jsp">
<strong>Select a subject:</strong>
<select name="subject_id">
<c:forEach var="row" items="${subjects.rows}">
<option value="${row.subject_id}">${row.name}</option>
</c:forEach>
</select>
<input type="submit" value="submit" name="submit" />
</form>
どちらの場合も、<c:forEach> タグは SQL クエリーからすべての subject_id の値と name の値をループし、各ペアを HTML の <option> タグに挿入します。この方法で、フォームのドロップダウンリストがデータと一緒に生成されます。
- 「DB レポート」項目から生成された表を削除します。削除場所は
取り消し線で示されています。
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@taglib prefix="sql" uri="http://java.sun.com/jsp/jstl/sql"%>
<%--
Document : index
Created on : Dec 22, 2009, 7:39:49 PM
Author : nbuser
--%>
<sql:query var="subjects" dataSource="jdbc/IFPWAFCAD">
SELECT subject_id, name FROM Subject
</sql:query>
<table border="1">
<!-- column headers -->
<tr>
<c:forEach var="columnName" items="${subjects.columnNames}">
<th><c:out value="${columnName}"/></th>
</c:forEach>
</tr>
<!-- column data -->
<c:forEach var="row" items="${subjects.rowsByIndex}">
<tr>
<c:forEach var="column" items="${row}">
<td><c:out value="${column}"/></td>
</c:forEach>
</tr>
</c:forEach>
</table>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
- 変更を保存します (Ctrl-S、Mac の場合は ⌘-S)。
- プロジェクトの開始ページをブラウザで再表示します。
ブラウザのドロップダウンリストに、データベースから取得された題目が追加されています。
プロジェクトを再配備する必要はありません。デフォルトでは、プロジェクトの「保存時にコンパイル」が有効になっています。つまり、ファイルを変更して保存するとファイルのコンパイルと配備が自動的に行われるので、プロジェクト全体を再コンパイルする必要はありません。プロジェクトの「プロパティー」ウィンドウの「コンパイル」カテゴリで、プロジェクトの「保存時にコンパイル」を有効または無効にすることができます。
response.jsp
応答ページには、開始ページで選択した題目に対応したカウンセラーの詳細情報が表示されます。作成するクエリーでは、選択された題名レコードの counselor_idfk と一致する counselor_id を持つカウンセラーレコードを選択する必要があります。
<%@page ... %> 宣言 (行 7) のすぐ上の行にカーソルを置き、「db」と入力してから Ctrl- スペースキーを押します。「DB クエリー」を選択します(前述のコード補完のヒントを参照)。- 表示されたダイアログに、次の詳細を入力します。
- 変数名:
counselorQuery
- スコープ:
page
- データソース:
jdbc/IFPWAFCAD
- クエリー文:
SELECT * FROM Subject, Counselor WHERE Counselor.counselor_id = Subject.counselor_idfk AND Subject.subject_id = ? <sql:param value="${param.subject_id}"/>
- 「了解」をクリックします。次の内容が
response.jsp ファイル内に生成されます。新しい内容はボールドで表示しています。
<%@taglib prefix="sql" uri="http://java.sun.com/jsp/jstl/sql"%>
<%--
Document : response
Created on : Dec 22, 2009, 8:52:57 PM
Author : nbuser
--%>
<sql:query var="counselorQuery" dataSource="jdbc/IFPWAFCAD">
SELECT * FROM Subject, Counselor
WHERE Counselor.counselor_id = Subject.counselor_idfk
AND Subject.subject_id = ? <sql:param value="${param.subject_id}"/>
</sql:query>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<sql:query> タグのために必要な taglib 指令が、IDE によって自動的に追加されました。また、クエリー内で <sql:param> タグを直接使用しました。このクエリーは index.jsp から送信される subject_id の値に依存しているため、${param.subject_id} 形式の式言語 (EL) 文を使用してその値を抽出して <sql:param> タグに渡すことができます。実行時にはこの値が、SQL 疑問符 (?) の代わりに使用されます。
<c:set> タグを使用して、クエリーから返される resultset の最初のレコード (つまり、行) に対応する変数を設定します。新しい内容はボールドで表示しています。
<sql:query var="counselorQuery" dataSource="jdbc/IFPWAFCAD">
SELECT * FROM Subject, Counselor
WHERE Counselor.counselor_id = Subject.counselor_idfk
AND Subject.subject_id = ? <sql:param value="${param.subject_id}"/>
</sql:query>
<c:set var="counselorDetails" value="${counselorQuery.rows[0]}"/>
クエリーから返される resultset には本来 1 件のレコードのみが含まれますが、このページは式言語 (EL) 文を使用してレコードの値にアクセスする必要があるため、この手順が必要になります。index.jsp では、<c:forEach> タグを使用するだけで resultset の値にアクセスできました。ただし、<c:forEach> タグは、クエリーに含まれる行に変数を設定することで動作します。そのため、EL 文に行変数を含めることで値を抽出できます。- JSTL
コアライブラリ用の taglib 指令をファイルの先頭に追加し、<c:set> タグが認識されるようにします。新しい内容はボールドで表示しています。
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@taglib prefix="sql" uri="http://java.sun.com/jsp/jstl/sql"%>
- HTML マークアップで、すべてのプレースホルダを、
counselorDetails 変数に保存されたデータを表示する EL 文のコードに置き換えます。変更場所はボールドで示されています。
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<link rel="stylesheet" type="text/css" href="style.css">
<title>${counselorDetails.name}</title>
</head>
<body>
<table>
<tr>
<th colspan="2">${counselorDetails.name}</th>
</tr>
<tr>
<td><strong>Description: </strong></td>
<td><span style="font-size:smaller; font-style:italic;">${counselorDetails.description}</span></td>
</tr>
<tr>
<td><strong>Counselor: </strong></td>
<td><strong>${counselorDetails.first_name} ${counselorDetails.nick_name} ${counselorDetails.last_name}</strong>
<br><span style="font-size:smaller; font-style:italic;">
<em>member since: ${counselorDetails.member_since}</em></span></td>
</tr>
<tr>
<td><strong>Contact Details: </strong></td>
<td><strong>email: </strong>
<a href="mailto:${counselorDetails.email}">${counselorDetails.email}</a>
<br><strong>phone: </strong>${counselorDetails.telephone}</td>
</tr>
</table>
</body>
</html>
完成したアプリケーションの実行
これで、アプリケーションは完成です。アプリケーションをもう一度実行し、ブラウザでどのように表示されるかを確認します。NetBeans には「保存時にコンパイル」機能があるため、アプリケーションのコンパイルや再配備に気を遣う必要はありません。プロジェクトを実行すると、確実に最新の変更が配備に反映されます。
メインツールバーの「プロジェクトを実行」(
) ボタンをクリックします。IDE のデフォルトのブラウザで index.jsp ページが開きます。
ブラウザに index.jsp が表示されたら、ドロップダウンリストから題目を選択し、「submit」をクリックします。ここで response.jsp ページに移動します。ここには選択内容に対応する詳細が表示されます。
これで「MySQL データベースを使用した単純な Web アプリケーションの作成」は終わりです。このドキュメントでは、MySQL データベースに接続する単純な Web アプリケーションの作成方法を説明しました。また、基本的な 2 層アーキテクチャーを使用するアプリケーションの構築方法を説明し、データに動的にアクセスして表示する手段として JSP、JSTL、JDBC、JNDI などさまざまなテクノロジを利用しました。
トラブルシューティング
チュートリアルのアプリケーションで発生する問題の多くは、GlassFish Server Open Source Edition と MySQL データベースサーバーとの間の接続に原因があります。アプリケーションが正しく表示されない場合、またはサーバーエラーを受信する場合は、次の確認作業が役に立つ場合があります。
データベースリソースは存在していますか ?
IDE の「サービス」ウィンドウ (Ctrl-5、Mac の場合は ⌘-5) を使用して、MySQL サーバーが実行されていること、および MyNewDatabase がアクセス可能で適切な表データを含んでいることを確認します。
- MySQL データベースサーバーに接続するには、「MySQL サーバー」ノードを右クリックし、「接続」を選択します。
MyNewDatabase の接続ノード (
) が「サービス」ウィンドウに表示されない場合は、MySQL のドライバノード (
) を右クリックし、「接続」を選択することで接続を作成できます。表示されたダイアログで、必要な詳細情報を入力します。
「データベースの新規接続」ダイアログの各フィールドの値は、「JDBC URL を表示」オプションに入力する URL 文字列が反映されます。したがって、URL (たとえば、jdbc:mysql://localhost:3306/MyNewDatabase) がわかっていれば、その URL をコピーして「JDBC URL を表示」フィールドにペーストすると、ダイアログにある残りのフィールドは自動的に入力されます。Subject 表と Counselor 表が存在し、これらの表にサンプルデータが含まれていることを確認するには、「MyNewDatabase」接続ノード () を展開し、「MyNewDatabase」カタログノード (
) を探します。カタログノードを展開し、既存の表を表示します。表ノードを右クリックして「データを表示」を選択すると、表のデータを確認できます。
接続プールとデータソースはサーバー上に存在していますか ?
アプリケーションを GlassFish サーバーに配備したら、プロジェクトに含まれる glassfish-resources.xml からサーバーに対して、JDBC リソースと接続プールを作成する指示を出すようにしてください。これらが存在しているかどうかの確認は、「サービス」ウィンドウの「サーバー」ノードからも実行できます。
- 「サーバー」>「GlassFish Server」>「リソース」ノードを展開します。「JDBC リソース」を展開し、「
glassfish-resources.xml」から作成された「jdbc/IFPWAFCAD」データソースを表示します。「接続プール」ノードを展開し、「glassfish-resources.xml」から作成された「IfpwafcadPool」接続プールを表示します。これについては以前に説明しています。
MySQL Connector/J ドライバは GlassFish サーバーにアクセスできますか ?
MySQL Connector/J ドライバが GlassFish サーバーに配備されていることを確認します。これについては「サーバーにデータベースドライバの JAR ファイルを追加」で説明しています。
- コンピュータ上で GlassFish サーバーのインストールフォルダを探し、
GlassFish domains/domain1/lib サブフォルダを表示します。このフォルダに、mysql-connector-java-5.1.6-bin.jar ファイルがあるはずです。
データベースはパスワードで保護されていますか ?
このチュートリアルで GlassFish サーバーのデータソースが正しく動作するためには、データベースをパスワードで保護しておく必要があります。パスワードが設定されていないデフォルトの MySQL root アカウントを使用している場合は、コマンド行プロンプトからパスワードを設定できます。
接続プールのプロパティーは正しく設定されていますか ?
接続プールがサーバーに対して正しく動作していることを確認します。
- 「サービス」ウィンドウ (Ctrl-5、Mac の場合は ⌘-5) を開き、「サーバー」ノードを展開します。
- GlassFish サーバーのノードを右クリックし、「管理コンソールを表示」を選択します。
- デフォルトのユーザー名に「
admin」、パスワードに「adminadmin」と入力します。
- コンソールの左側にあるツリーで、「リソース」>「JDBC」>「接続プール」>「
IfpwafcadPool」ノードを展開します。「IfpwafcadPool」接続プールの詳細がメインウィンドウに表示されます。
- 「Ping」ボタンをクリックします。接続プールが正しく設定されている場合、「
Ping が成功しました」というメッセージが表示されます。
- Ping が失敗した場合は、「追加プロパティ」タブをクリックし、一覧表示されているプロパティーの値が正しく設定されていることを確認します。
関連項目
Java による Web 開発の詳細については、次のリソースを参照してください。
- NetBeans の記事およびチュートリアル
- Java Database Connectivity (JDBC)
- JavaServerPages 標準タグライブラリ (JSTL)
- Java Naming and Directory Interface (JNDI)
) アイコンをダブルクリックします。「挿入フォーム」ダイアログで、「アクション」テキストフィールドに「
) を、先ほど追加したドロップダウンリストのすぐ後ろに追加します。この作業は、パレットを使用するか、前述の手順のようにエディタのコード補完を呼び出して行えます。「挿入ボタン」ダイアログで、「ラベル」テキストフィールドと「名前」テキストフィールドの両方に「
