JBuilder2005 実際のJSPログインページ(2)

著者：Eve Cole 更新時間：2009-07-02 17:10:51

「ファイル」→「新規...」→「Web」→「JSP」アイコンをダブルクリックすると、次の図に示すように、JSP ウィザードを作成するためのダイアログボックスが表示されます。

図 3 ウィザードによる login.jsp の作成

·Web モジュール: プロジェクトに複数の Web モジュールがある場合、JSP を追加する Web モジュールをここで指定できます。プロジェクトには webModule が 1 つしかないため、ウィザードはデフォルトで webModule に設定します。

·名前: JSP ファイル名を入力します。接尾辞 .jsp を入力することも、接尾辞を付けずに「login」と直接入力することもできます。

「サンプル Bean の生成」オプションをチェックすると、JBuilder はサンプル Bean を生成し、JSP に Bean を導入します。初心者向けに、このオプションを使用して JSP が Bean を参照する方法を確認できます。また、「エラーページの生成」オプションにより、JSP に対応するエラー処理 JSP ファイルが自動的に作成されます。ここではチェックしません。

次の図に示すように、「完了」を直接クリックして、login.jsp ファイルがコンテンツ・ペインのコンパイラーに表示されます。

図4 ウィザードで作成されたJSPファイル

JSP コンパイルウィンドウの左側と右側に 1 つずつあり、渡すことができます。

そして

左側の列はボタンで制御され、JSP タグと HTML タグを配置するためのパネルです。上の図に示すように、さまざまなタグを JSP ファイルにドラッグアンドドロップできます。パネルからのフォーム。HTML タグは、login.jsp ファイルに配置されます。

次の図に示すように、右側の縦列は、JSP ファイル内で現在のカーソルが置かれているラベルの属性コンパイラです。

図 5 JSP タグ属性エディターの設定

プロパティエディタは動的です。カーソルを別のラベルに移動すると、プロパティエディタにはこのラベルの設定可能なプロパティがすべて表示されます。上図のように、HTMLのformタグの属性エディタに相当し、そのaction属性をswitch.jspに設定し、リクエストデータの送信にPOSTを使用するように指定します。

login.jsp には、ユーザー名ドロップダウンボックス、パスワード入力ボックス、ログイン送信ボタンが用意されています。コードは次のとおりです。

コードリスト 4 login.jsp

1. ＜%@page contentType="text/html; charset=GBK" %＞
2. ＜html＞
3. ＜頭＞
4. ＜タイトル＞ログイン＜/タイトル＞
5. ＜/頭＞
6. ＜本文 bgcolor="#ffffff">
7. ＜フォーム名="フォーム1" メソッド="ポスト" アクション="switch.jsp">
8. ユーザー名: <select name="userId">
9. ＜オプション値=""選択時＞--ログインユーザー--＜/option＞
10. ＜option value="100000">ジャンズヤ＜/option＞
11. ＜option value="100001">バオシュヤ＜/option＞
12. ＜option value="100002">縦歯＜/option＞
13. ＜/選択＞
14. パスワード: <input name="password" type="password">
15. ＜input type="submit" name="Submit" value="ログイン">
16. ＜/フォーム＞
17. ＜/本文＞
18. ＜/html＞

form タグは Web ページ内のフォームを表します。フォームには複数のコンポーネントを含めることができます。Web フォームが送信されると、これらのコンポーネントのデータが HTTP プロトコルを通じて action 属性で指定された JSP ファイルに送信されます。フォームデータは通常、POST 経由で送信されます。POST 送信方法にはデータ量の制限がなく、機密性が高くなります。

login.jspのエフェクトページは以下のとおりです。

図 6 login.jsp エントリページ

実務経験:

JSP ファイルコードには静的部分と動的部分が含まれています。つまり、1 つの部分は HTML コードで、もう 1 つの部分は JSP タグとスクリプトレットコードです。 JSP は通常、動的ロジックを備えた Web ページです。JBuilder は、JSP タグやスクリプトレットなどの動的コード部分を非常によくサポートしており、CodeInsight や TagInsight などのツールを使用してコーディングを迅速かつ正確に完了でき、JSP をコンパイルおよびデバッグすることもできます。 JSP の静的 HTML コードの作成とビジュアルデザインの点では、JBuilder は明らかに JBuilder よりも優れています。

物事の複雑さは分業を促進し、細かい分業は専門能力の開発を促進します。JSP を作成する場合、JBuilder を入手したら他に何もすることがなくなるわけではありません。 Han Xinshanbing 氏と Xiao Heshanmou 氏、Dreamweaver と JBuilder を組み合わせて、Dreamweaver を使用して JSP のビジュアル部分を開発し、JBuilder を使用して JSP の動的コード部分を開発できれば、この 2 つは相互に補完し合い、補完し合うことになり、JSP は開発作業がより効率化されます。

ユーザーリストを動的に変更する

現在作成されているlogin.jspには欠陥があり、データベースのバックグラウンドでT_USERテーブルに他のユーザーを追加する場合、ユーザー名のドロップダウンボックスが静的コードであるため、新しく作成されたユーザーがページに表示されないとします。ユーザーを追加する必要があります。名前リストは動的コードに変更され、データベーステーブル T_USER のレコードを使用してドロップダウンボックスのデータが動的に生成されます。

この作業は UserList.ava クラスを通じて完了し、プロジェクト内に UserList.java を作成します。コードは次のとおりです。

コードリスト 5 UserList.java

1. パッケージ書店。
2. java.sql.* をインポートします。
3.
4.パブリッククラスUserList
5. {
6. //HTML ドロップダウンボックスのユーザーリストコードを取得します
7. public static String getUserListHTML() {
8. 接続 conn = null;
9. StringBuffer sBuf = new StringBuffer();
10. {を試してください
11. conn = DBConnection.getConnection();
12. PreparedStatement pStat = conn.prepareStatement(
13. "T_USER から USER_ID、USER_NAME を選択");
14. ResultSet rs = pStat.executeQuery();
15. while (rs.next()) {
16. sBuf.append("＜オプション値='" + rs.getString("USER_ID") + "'＞" +
17. rs.getString("USER_NAME") + "＜/option＞n");
18. }
19. sBuf.toString() を返す。
20. } catch (SQLException ex) {
21. ex.printStackTrace();
22.「」を返します。
23. } 最後に {
24. {を試してください
25. if (conn != null) {
26. conn.close();
27. conn = null;
28. }
29. } catch (SQLException ex1) {
30. }
31. }
32. }
33. }

UserList.java は静的な getUserListHTML() メソッドのみを提供します。このメソッドは、バックエンドデータベースの T_USER テーブルからユーザーレコードを取得し、16 ～ 17 行目に示すように、HTML 選択コンポーネントのオプションコードを生成します。

このクラスを作成した後、このクラスを参照して、login.jsp のコードを調整します。まず、ページ命令タグの import 属性を通じて UserList クラスを参照し、次に select オプションの内容を、メソッドによって返される値に調整します。 getUserListHTML() メソッド (以下の図を参照)

図 7 CodeInsight によるコードの作成

式タグを使用して元の静的 HTML コードを置き換える一般的な Java クラスを作成するのと同じように、CodeInsight を使用して JSP にコードを入力することもできることに注意してください。調整されたlogin.jspのコードは次のとおりです(太字)。

コードリスト6: 調整されたlogin.jspコード

1. ＜%@page contentType="text/html; charset=GBK" import="bookstore.UserList" %＞
2. ＜html＞
3. ＜頭＞
4. ＜タイトル＞ログイン＜/タイトル＞
5. ＜/頭＞
6. ＜本文 bgcolor="#ffffff">
7. <Form name="Form 1" Method="post" action="switch.jsp">ユーザー名:
8. ＜name="userId">を選択＞
9. ＜オプション値=""選択時＞--ログインユーザー--＜/option＞
10. ＜%=UserList.getUserListHTML()%＞
11. ＜/選択＞
12. パスワード: <input name="password" type="password">
13. ＜input type="submit" name="Submit" value="ログイン">
14. ＜/フォーム＞
15. ＜/本文＞
16. ＜/html＞

login.jsp を保存した後、コンテンツペインで [login.jsp] ファイルラベルを右クリックし、[デフォルトを使用して Web 実行] を選択すると、JBuilder が Tomcat 5.0 アプリケーションサーバーを起動し、ポート 8080 で実行され、login.jsp ファイルをコンパイルして実行します。以下の図に示すように、次を表示します。

図 8 JBuilder での login.jsp の実行

JBuilder は自動的に Web ビューページに切り替えて、ページの実行効果を表示します。ただし、JBuilder のブラウザは Web ページのサポートが非常に弱く、JavaScript スクリプトをサポートしていません。したがって、login.jsp を実行した後、IE を使用して Web ページの効果を確認するのが最善です。図に示すように、IE を開き、JBuilder のアクセス login.jsp のアドレスを IE のアドレスバーにコピーするだけです。下の図：

図 9 IE を使用して JBuilder で実行されている login.jsp にアクセスする

この時点で、ユーザー名のドロップダウンボックス内のユーザーはすでに動的ユーザーリストに含まれており、T_USER テーブルでユーザーを追加または削除すると、ドロップダウンボックス内のユーザーもそれに応じて変更されます。

JSP を実行する前に、この JSP ファイルを個別にコンパイルすることをお勧めします。コンテンツペインで JSP ファイルラベルを右クリックし、ポップアップメニューで「make "xxx.jsp"」を選択して、JSP ファイルのコンパイルを完了し、間に合った。 JSP ファイルと Java ファイルを編集するときの最大の違いは、Java プログラムファイルのエラーはすべてエディターと構造ペインにリストされますが、JSP ファイルの一部のエラーは検出するためにコンパイルする必要があることです。

ヒント：

JSP ファイルをコンパイルするには、まずサーブレットファイルに変換し、次に中間サーブレットファイルをコンパイルする必要があるため、エラーが発生した場合は JSP ファイルにリダイレクトされます。そのため、JSP ファイルのコンパイルには時間がかかり、時間がかかることがよくあります。 Java ファイルをコンパイルするよりも数倍の時間がかかります。デフォルトでは、プロジェクトをコンパイルするときにプロジェクト全体のすべての JSP がコンパイルされるため、時間がかかります。したがって、コンパイルプロジェクトと一緒に JSP ファイルをコンパイルする設定をキャンセルすることをお勧めします。[プロジェクト] -> [プロジェクトプロパティ...] -> [ビルド] -> [ビルド設定] ページの [ビルド時に JSP のエラーを確認する] オプションを選択します。本当に必要な場合はこのオプションをチェックし、コンパイル直後にこのオプションをキャンセルしてください。この設定により、開発に多くの貴重な時間を費やすことができます。