Web アプリケーション開発入門 大岩研究会 今野隆平 2002 年 5 月 9 日 Introduction to Web Application Development.

Presentation on theme: "Web アプリケーション開発入門 大岩研究会 今野隆平 2002 年 5 月 9 日 Introduction to Web Application Development."— Presentation transcript:

1 Web アプリケーション開発入門 大岩研究会 今野隆平 2002 年 5 月 9 日 Introduction to Web Application Development

2 本日の目標 Web アプリケーションを作る！

3 Web アプリケーションとは Web ブラウザからサーバ上のサービスを受けられる（第 1 回目のサブゼミ より） Web アプリの例として前回とりあげられたものは・・・ 掲示板、検索エンジンなど 質問① 掲示板は Web アプリと言えるか？ 動的なページ ≠ Web アプリ 質問② ログインはどうでしょう？ それだけでは単なる動的なページ 例：ログイン後に履修登録が行えるからログインを含めて Web 履修シ ステムは Web アプリと言える 上の例を使えば、ログイン画面、ログイン認証プログラム、授業選択 画面、など Web 履修登録に関係するファイルを全てまとめて Web アプ リととらえる Web アプリは人を幸せにするコンセプトを持っている！

4 サーバサイド Java 技術は Web アプリを作るためにあ る！ CGI とサーバサイド Java で Web アプリを２つ作ってみた・・・何が違うだ ろう？ サーバサイド Java で Web アプリを作る場合、１つのディレクトリに関連 するファイルをすべて設置する。そしてそのディレクトリを１つのソフ トウェアのように扱う Web アプリ A に関する HTML ファイル サーブレット実行ファイル 画像ファイル などをまとめて管理する /Web アプリ B Web アプリ B に関する HTML ファイル サーブレット実行ファイル 画像ファイル などまとめて管理する loginB.html loginB.cgi /public_h ｔ ml /cgi loginA.html loginA.cgi 例 /Web アプリ A 例 数多くのファイルが関連する Web アプリの扱いが大 変！ Web アプリという概念がない CGI は動的なページを作るにとどまる技術 Web アプリを一つのディレクトリで管理する仕組み がある Web アプリという概念がある サーバサイド Java は Web アプリを作るための技術 2 個目を作ると・・・ CGI の場合、どのファイルがどの Web アプリに関連しているのがわかりに くい

5 main(){ _________ } 普通の Java プログラムの実行 doGet(){ _________ ________ } Servlet プログラムの実行 アプリケーションサーバ サーブレットとは サーバ側で動作する Java のプログラム クライアント（ブラウザなど）から HTTP リクエストがくると実行される HTTP リクエストを受け取り何らかの処理をして HTTP レスポンスで結果 を返す 単独では動作せず、サーブレットを実行できる環境が必要 java HOGE 実行 HTTP リクエスト 実行 サーブレットはアプリケーションサーバが実行する

6 アプリケーションサーバとは 別名を Web アプリケーションサーバと言う Web サーバを Web アプリケーションのために拡張したもの HTTP で通信する サーブレットなどのサーバサイド Java の実行環境を実装している Web アプリを管理するために便利な機能を持つ 各 Web アプリを一つのディレクトリで管理する 各 Web アプリごとに決まりごとを設定できるなど・・・ Tomcat はアプリケーションサーバの一つである サーブレットコンテナ Web サーバ アプリケーションサーバ Tomcat クライアントと Web アプリが HTTP リクエスト／レスポンスを利用して 対話するときの仲介役になる サーブレット

7 手順 クライアントとサーブレットが HTTP リクエスト／レスポンスを利用して 対話するのを見る（復習） ① Tomcat を起動する ② DOS プロンプトを開く ③C:>telnet localhost 8080 と打って改行 ④GET /examples/servlet/SampleServlet HTTP/1.1 と打って改行 2 回 するとこんな HTTP レスポンスがサーブレットから帰ってく る HTTP/1.1 200 OK Content-Type: text/html Date: Wed, 08 May 2002 07:32:58 GMT Server: Apache Tomcat/4.0.1-b1 (HTTP/1.1 Connector) Connection: close Hello Sample Servlet World! ホストとの接続が切断されました。 クライアントからのリクエストに対して サーブレットが処理した結果を 送信してきたのが分かりましたか？ それでは前回作ったサーブレットを GET リクエストで起動して みよう

8 今行われたことをプログラミングの面から見てみる doGet(HttpServletRequest req, HttpServletResponse res){ GET /examples/servlet/SampleServlet HTTP/1.1 Accept: image/gif, image/x-xbitmap, image/jpeg, image/pjpeg, application/vnd. ms-powerpoint, application/vnd.ms-excel, application/msword, */* Accept-Language: ja Accept-Encoding: gzip, deflate User-Agent: Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.0) Host: localhost:10000 Connection: Keep-Alive リクエスト・メッセージ Content-Type: Date: Wed, 08 May 2002 07:32:58 GMT Server: Apache Tomcat/4.0.1-b1 (HTTP/1.1 Connector) Connection: close レスポンス・メッセージ res.setContentType( “ text/html ” ); PrintWriter out = res.getWriter(); out.println( “ ” ); out.println( “ Sample Servlet World ” ); out.println( “ ” ); } Hello Sample Servlet World! text/html クライアントに処理結果を反映させたレスポンスを送る

9 Web アプリケーションを作る ① Web アプリ用のディレクトリの 準備 ② WEB-INF ディレクトリを作る ③ web.xml ファイルを作る ④プログラム書く ⑤プログラムをコンパイルする ⑥クラスファイルを配置する したの３つは実習課題です。とりあえず、上の３つを順を追ってみていきましょう。 以下の手順で Web アプリケーションを作ります。

10 Web アプリケーションには以下の決まりごとが ある Web アプリケーションのファイル構成 /Web アプリ名 /WEB-INF/classes /WEB-INF/lib /WEB-INF /web.xml /index.html /top.gif Web アプリケーションの呼び出し方法 （ web.xml で指定可） サーブレットの呼び出し http:// ホスト名 : ポート番号 /web アプリ名 /servlet/ クラス名 例： http://localhost:8080/examples/servlet/SampleServlet HTML ファイルの呼び出し http:// ホスト名 : ポート番号 /web アプリ名 /index.html

11 Web アプリの宣言 TOMCAT_HOME/webapps/ 直下に新しいディレクトリを作る TOMCAT_HOME/webapps/Web アプリ名 このディレクトリがルートになる http://localhost:8080/Web アプリ名 / からこの Web アプ リにアクセスする TOMCAT_HOME/ webapps Web アプリ名

12 TOMCAT_HOME/webapps/Web アプリ名以下に WEB-INF ディレクトリを 作成する その中にコンパイルしたくラスを配置する classes ディレクトリを作る クラスファイルを格納するディレクトリ。 Web アプリケーションを実行する 際にはここがクラスパスに自動的に設定される。作成したサーブレットはこ こに置く必要がある。 そしてさらに jar ファイルを収めるための lib ディレクトリを作る WEB アプリケーションで使う beans などの jar 形式のアーカイブをここに格納 する。実行時には自動的にクラスパスに設定される。ここは今は気にしない ように。 WEB-INF ディレクトリを作る Web アプリ名 WEB-INF classes lib

13 WEB_INF/web.xml ファイルを作る ディレクトリの準備ができたので、この WEB アプリケーションの設定 ファイルである web.xml を WEB-INF 以下に作成する。 web.xml を使うと Web アプリごとに決まりごとを設定できる！ 具体的には以下のようなものが設定できる ①サーブレットの初期化パラメータ ②セッションコンフィグレーション ③サーブレット／ JSP の定義 ④サーブレット／ JSP のマッピング ⑤ MIME タイプのマッピング ⑥ウェルカムファイルリスト ⑦エラーページ ⑧セキュリティー 今回設定するのはサーブレットの定義とマッピングです。ここではとり あえず、骨組みだけ書いて置いて置きましょう。 Web アプリ名 WEB-INF classes lib web.xml 基本ファイル構成の出来上がり

14 では実習課題 日付を表示するサーブレットを作ってさっきのやり方で簡単 な Web アプリを作る 自分の Web アプリにトップページを加えてください。上で 作ったサーブレットをリンクで呼び出せるようにしてくださ い。 HTML ファイルの置き場所に気をつけてください。